*/
table.juridica-presentacion { width: 100%; border-collapse: collapse; background: #efece7; }
table.juridica-presentacion td { vertical-align: top; padding: 0; }
table.juridica-presentacion td.portada { width: 300px; }
table.juridica-presentacion td.portada img { display: block; width: 100%; height: auto; }
table.juridica-presentacion td.texto { padding: 28px 32px; }
/* =========================================================
BOTÓN DE ENVÍO: selector definitivo, sin depender del bloque
========================================================= */
.pkp_structure_sidebar .pkp_block a.cmp_button,
.pkp_structure_sidebar .pkp_block a[class*="submission"],
.pkp_structure_sidebar a.cmp_button {
display: flex !important;
align-items: center;
justify-content: center;
gap: 10px;
width: 100%;
box-sizing: border-box;
padding: 14px 15px !important;
background: #ffffff !important;
background-image: none !important;
border: 2px solid #403027 !important;
border-radius: 4px !important;
color: #403027 !important;
font-weight: 700 !important;
font-size: 16px !important;
text-decoration: none !important;
box-shadow: none !important;
text-shadow: none !important;
}
.pkp_structure_sidebar .pkp_block a.cmp_button:hover,
.pkp_structure_sidebar .pkp_block a[class*="submission"]:hover,
.pkp_structure_sidebar a.cmp_button:hover {
background: #403027 !important;
color: #ffffff !important;
}
.pkp_structure_sidebar .pkp_block a.cmp_button::before,
.pkp_structure_sidebar a.cmp_button::before {
content: "";
flex: 0 0 auto;
width: 22px;
height: 22px;
background: url("data:image/svg+xml;utf8,
") center/contain no-repeat;
}
.pkp_structure_sidebar .pkp_block a.cmp_button:hover::before,
.pkp_structure_sidebar a.cmp_button:hover::before { filter: brightness(0) invert(1); }
/* =========================================================
JUEGO DE ICONOS SVG (azul #403027, embebidos, sin librerías)
Uso en botones: class="sidebar-btn icono-login"
Uso automático: título de cada bloque nativo
========================================================= */
.pkp_structure_sidebar [class*="icono-"]::before,
.pkp_structure_sidebar .pkp_block .title::before {
flex: 0 0 auto;
display: inline-block;
width: 22px;
height: 22px;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
/* En los títulos el icono va pegado al texto */
.pkp_structure_sidebar .pkp_block .title::before {
width: 20px;
height: 20px;
margin-right: 8px;
vertical-align: -4px;
}
/* --- Acceso / iniciar sesión --- */
.icono-login::before {
content: "";
background-image: url("data:image/svg+xml;utf8,
");
}
/* --- Publicar / enviar artículo --- */
.icono-publicar::before,
.pkp_structure_sidebar .block_make_submission .title::before {
content: "";
background-image: url("data:image/svg+xml;utf8,
");
}
/* --- Información --- */
.icono-info::before,
.pkp_structure_sidebar .block_information .title::before {
content: "";
background-image: url("data:image/svg+xml;utf8,
");
}
/* --- Buscar --- */
.icono-buscar::before,
.pkp_structure_sidebar .block_search .title::before {
content: "";
background-image: url("data:image/svg+xml;utf8,
");
}
/* --- Métricas / estadísticas --- */
.icono-metrica::before {
content: "";
background-image: url("data:image/svg+xml;utf8,
");
}
/* --- Contacto / correo --- */
.icono-contacto::before {
content: "";
background-image: url("data:image/svg+xml;utf8,
");
}
/* --- Archivo / números anteriores --- */
.icono-archivo::before {
content: "";
background-image: url("data:image/svg+xml;utf8,
");
}
/* --- Descargar / PDF --- */
.icono-descargar::before {
content: "";
background-image: url("data:image/svg+xml;utf8,
");
}
/* =========================================================
ICONOS EN BLOQUES PERSONALIZADOS
El título de un bloque personalizado no admite HTML, así que
el icono se asigna por el id que genera OJS: #customblock-
Comprueba el id real con el inspector del navegador.
========================================================= */
#customblock-apoya .title::before {
content: "";
background-image: url("data:image/svg+xml;utf8,");
}
#customblock-metrica .title::before,
#customblock-metricas .title::before {
content: "";
background-image: url("data:image/svg+xml;utf8,");
}
#customblock-visitas .title::before {
content: "";
background-image: url("data:image/svg+xml;utf8,");
}
/* --- Logos dentro de bloques personalizados: tamaño uniforme --- */
.pkp_structure_sidebar .block_custom .content img {
display: block;
max-width: 100%;
height: auto;
margin: 0 auto 15px auto;
}
.pkp_structure_sidebar .block_custom .content p { margin: 0 0 12px 0; }
/* =========================================================
CARRUSEL DE DESTACADOS (función nativa de OJS 3.5, Swiper)
Se configura en Ajustes del sitio web > Destacados.
========================================================= */
.highlights { margin: 0 0 45px 0; }
.highlights .swiper { position: relative; padding-bottom: 35px; }
.highlights .swiper-slide-image {
width: 100%;
height: auto;
max-height: 340px;
object-fit: cover;
border-radius: 6px;
}
.highlights .swiper-slide-content { padding: 18px 4px 0 4px; }
.highlights .swiper-slide-title {
margin: 0 0 8px 0;
color: #403027;
font-size: 20px;
font-weight: 700;
line-height: 1.35;
}
.highlights .swiper-slide-desc {
color: #444;
font-size: 15px;
line-height: 1.6;
}
/* Botón del destacado, con el mismo lenguaje que la barra lateral */
.highlights .swiper-slide-button {
display: inline-block;
margin-top: 15px;
padding: 10px 22px;
background: #ffffff;
border: 2px solid #403027;
border-radius: 4px;
color: #403027;
font-weight: 700;
text-decoration: none;
}
.highlights .swiper-slide-button:hover { background: #403027; color: #ffffff; }
/* Flechas circulares azules */
.highlights .swiper-button-prev,
.highlights .swiper-button-next {
width: 46px;
height: 46px;
border: none;
border-radius: 50%;
background: #403027;
color: #ffffff;
cursor: pointer;
}
.highlights .swiper-button-prev::after,
.highlights .swiper-button-next::after {
font-size: 18px;
font-weight: 700;
}
.highlights .swiper-button-prev:hover,
.highlights .swiper-button-next:hover { background: #5a3c2a; }
/* Puntos de paginación en azul */
.highlights .swiper-pagination-bullet { background: #9aa8bf; opacity: 1; }
.highlights .swiper-pagination-bullet-active { background: #403027; }
/* =========================================================
CORRECCIÓN DE LA TABLA DE CONTENIDOS (OJS 3.5)
Anula la maquetación flex heredada del CSS para OJS 3.3,
que solapaba título, autores y galeradas.
========================================================= */
.obj_article_summary {
display: block !important;
margin-bottom: 0;
padding: 22px 0;
border-bottom: 1px solid #e6e6e6;
}
.obj_article_summary .title {
display: block;
text-align: left !important;
margin: 0 0 6px 0;
font-size: 1.15rem;
line-height: 1.4;
}
.obj_article_summary .title a { color: #403027; }
.obj_article_summary .authors {
display: block;
text-align: left;
margin: 0 0 8px 0;
color: #555;
font-style: normal;
font-size: 14px;
}
.obj_article_summary .pages {
display: block;
margin: 0 0 10px 0;
color: #777;
font-size: 13px;
}
.obj_article_summary .galleys_links {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin: 0;
padding: 0;
list-style: none;
}
.obj_article_summary .galleys_links li { margin: 0; }
.obj_article_summary .cover {
float: left;
width: 110px;
margin: 0 18px 10px 0;
}
.obj_article_summary::after { content: ""; display: block; clear: both; }
/* =========================================================
CARRUSEL DE ARTÍCULOS DEL NÚMERO ACTUAL
Marcado generado por el tema (carruselArticulos.tpl).
3 tarjetas en escritorio, 2 en tableta, 1 en móvil.
========================================================= */
.juridica-carrusel { margin: 10px 0 45px 0; }
.juridica-carrusel-titulo {
margin: 0 0 6px 0;
padding-bottom: 10px;
border-bottom: 2px solid #403027;
color: #403027;
font-size: 20px;
font-weight: 700;
text-align: center;
}
.juridica-carrusel-marco {
position: relative;
margin-top: 25px;
padding: 0 56px;
}
.juridica-carrusel-pista {
display: flex;
gap: 24px;
margin: 0;
padding: 0;
list-style: none;
overflow-x: auto;
scroll-snap-type: x mandatory;
scroll-behavior: smooth;
scrollbar-width: none;
}
.juridica-carrusel-pista::-webkit-scrollbar { display: none; }
.juridica-tarjeta {
flex: 0 0 calc((100% - 48px) / 3);
scroll-snap-align: start;
min-width: 0;
}
.juridica-tarjeta-enlace { display: block; text-decoration: none; }
.juridica-tarjeta img,
.juridica-tarjeta-sinimagen {
display: block;
width: 100%;
aspect-ratio: 4 / 3;
object-fit: cover;
border-radius: 6px;
background: #efece7;
}
.juridica-tarjeta-titulo {
display: block;
margin-top: 14px;
color: #403027;
font-size: 16px;
font-weight: 700;
line-height: 1.4;
}
.juridica-tarjeta-enlace:hover .juridica-tarjeta-titulo { text-decoration: underline; }
.juridica-tarjeta-autores {
margin: 6px 0 0 0;
color: #555;
font-size: 14px;
line-height: 1.45;
}
.juridica-tarjeta-paginas {
margin: 6px 0 0 0;
color: #808080;
font-size: 13px;
}
/* Flechas circulares azules */
.juridica-carrusel-control {
position: absolute;
top: 38%;
transform: translateY(-50%);
width: 46px;
height: 46px;
display: flex;
align-items: center;
justify-content: center;
border: none;
border-radius: 50%;
background: #403027;
color: #ffffff;
font-size: 26px;
line-height: 1;
cursor: pointer;
transition: background-color .2s ease, opacity .2s ease;
}
.juridica-carrusel-control:hover { background: #5a3c2a; }
.juridica-carrusel-control:disabled { opacity: .3; cursor: default; }
.juridica-carrusel-control.izq { left: 0; }
.juridica-carrusel-control.der { right: 0; }
@media (max-width: 1024px) {
.juridica-tarjeta { flex-basis: calc((100% - 24px) / 2); }
}
@media (max-width: 640px) {
.juridica-carrusel-marco { padding: 0 44px; }
.juridica-tarjeta { flex-basis: 100%; }
}
/* =========================================================
CARRUSEL - AJUSTES v2.1 (según la muestra)
Imagen más alta, título negro, autores en negrita azul,
icono PDF tipo documento, flechas con chevron grueso.
========================================================= */
.juridica-tarjeta img,
.juridica-tarjeta-sinimagen {
aspect-ratio: 1 / 1; /* antes 4/3: ahora casi cuadrada */
}
.juridica-tarjeta-titulo {
margin-top: 18px;
color: #000000;
font-size: 17px;
font-weight: 700;
line-height: 1.35;
}
.juridica-tarjeta-enlace:hover .juridica-tarjeta-titulo {
color: #403027;
text-decoration: none;
}
.juridica-tarjeta-autores {
margin: 6px 0 0 0;
color: #403027;
font-weight: 700;
font-size: 15px;
line-height: 1.4;
}
.juridica-tarjeta-seccion {
margin: 18px 0 0 0;
color: #000000;
font-size: 15px;
}
.juridica-tarjeta-paginas {
margin: 14px 0 0 0;
color: #666666;
font-size: 14px;
}
/* --- Galeradas con icono de documento --- */
.juridica-tarjeta-galeradas {
display: flex;
gap: 12px;
margin: 14px 0 0 0;
padding: 0;
list-style: none;
}
.juridica-tarjeta-galeradas a {
display: block;
width: 36px;
height: 42px;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
transition: transform .15s ease;
}
.juridica-tarjeta-galeradas a:hover { transform: translateY(-2px); }
/* Documento con esquina doblada y banda "PDF" */
.juridica-icono-pdf {
background-image: url("data:image/svg+xml;utf8,");
}
/* Otros formatos (ePub, HTML...) */
.juridica-icono-archivo {
background-image: url("data:image/svg+xml;utf8,");
}
/* --- Flechas: chevron grueso en círculo --- */
.juridica-carrusel-control { font-size: 0; }
.juridica-carrusel-control svg {
width: 24px;
height: 24px;
fill: none;
stroke: #ffffff;
stroke-width: 3.5;
stroke-linecap: round;
stroke-linejoin: round;
}
.juridica-carrusel-control { top: 30%; }
/* --- Enlace "Ver más…" --- */
.juridica-carrusel-vermas {
margin: 30px 0 0 0;
text-align: center;
}
.juridica-carrusel-vermas a {
color: #403027;
font-weight: 700;
font-size: 17px;
text-decoration: none;
}
.juridica-carrusel-vermas a:hover { text-decoration: underline; }
/* Texto sólo para lectores de pantalla */
.visually-hidden {
position: absolute !important;
width: 1px; height: 1px;
margin: -1px; padding: 0;
overflow: hidden;
clip: rect(0 0 0 0);
white-space: nowrap;
border: 0;
}
/* =========================================================
PÁGINA DEL ARTÍCULO (v2.2)
Columna de detalles al estilo de la muestra: etiquetas grises,
separadores finos, galeradas como iconos, métricas y gráfico.
========================================================= */
.obj_article_details .entry_details .item {
padding: 22px 22px;
border-bottom: 1px solid #e3e3e3;
}
.obj_article_details .entry_details .item:last-child { border-bottom: none; }
.obj_article_details .entry_details .item .label {
margin: 0 0 8px 0;
font-size: 14px;
font-weight: 400;
color: #6b6b6b;
text-transform: none;
letter-spacing: 0;
}
.obj_article_details .entry_details .item.cover_image img {
display: block;
width: 100%;
height: auto;
}
.obj_article_details .entry_details .item.issue a,
.obj_article_details .entry_details .item.license a { color: #403027; }
/* --- Galeradas como iconos en rejilla --- */
.obj_article_details .galleys_links {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 16px 10px;
margin: 0;
padding: 0;
list-style: none;
justify-items: center;
}
.obj_article_details .galleys_links li { margin: 0; }
.obj_article_details a.juridica-galerada {
display: block;
width: 38px;
height: 44px;
padding: 0 !important;
border: 0 !important;
border-radius: 0;
background-color: transparent !important;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
font-size: 0 !important;
line-height: 0;
color: transparent !important;
overflow: hidden;
transition: transform .15s ease;
}
.obj_article_details a.juridica-galerada::before,
.obj_article_details a.juridica-galerada::after { display: none !important; content: none !important; }
.obj_article_details a.juridica-galerada:hover,
.obj_article_details a.juridica-galerada:focus { transform: translateY(-2px); }
.obj_article_details a.juridica-galerada-pdf { background-image: url("data:image/svg+xml;utf8,"); }
.obj_article_details a.juridica-galerada-xml { background-image: url("data:image/svg+xml;utf8,"); }
.obj_article_details a.juridica-galerada-epub { background-image: url("data:image/svg+xml;utf8,"); }
.obj_article_details a.juridica-galerada-html { background-image: url("data:image/svg+xml;utf8,"); }
.obj_article_details a.juridica-galerada-mp3 { background-image: url("data:image/svg+xml;utf8,"); }
.obj_article_details a.juridica-galerada-kindle { background-image: url("data:image/svg+xml;utf8,"); }
.obj_article_details a.juridica-galerada-archivo { background-image: url("data:image/svg+xml;utf8,"); }
/* --- Métricas por formato --- */
.juridica-metricas .juridica-metricas-sub {
margin: -4px 0 12px 0;
font-size: 14px;
color: #6b6b6b;
}
.juridica-metricas-lista {
margin: 0;
padding: 0 0 12px 0;
list-style: none;
}
.juridica-metricas-lista li {
display: flex;
align-items: center;
gap: 8px;
padding: 3px 0;
font-size: 15px;
}
.juridica-metricas-lista li::before {
content: "";
flex: 0 0 16px;
height: 16px;
background: center / contain no-repeat;
}
.juridica-metrica-vista::before { background-image: url("data:image/svg+xml;utf8,") !important; }
.juridica-metrica-descarga::before { background-image: url("data:image/svg+xml;utf8,") !important; }
.juridica-metrica-audio::before { background-image: url("data:image/svg+xml;utf8,") !important; }
.juridica-metrica-nombre { flex: 1 1 auto; }
.juridica-metrica-total { font-variant-numeric: tabular-nums; }
/* --- Gráfico de descargas (HTML/CSS puro) --- */
.juridica-grafico { margin: 40px 0; }
.juridica-grafico .label {
font-size: 17px;
font-weight: 700;
color: #222222;
margin: 0 0 18px 0;
}
.juridica-grafico-cuerpo {
display: flex;
gap: 8px;
max-width: 420px;
height: 200px;
padding-bottom: 22px; /* espacio para los meses */
}
.juridica-grafico-eje {
display: flex;
flex-direction: column;
justify-content: space-between;
margin: -7px 0 -7px 0;
padding: 0;
list-style: none;
font-size: 12px;
color: #666666;
text-align: right;
font-variant-numeric: tabular-nums;
}
.juridica-grafico-zona {
position: relative;
flex: 1 1 auto;
border-left: 1px solid #bdbdbd;
border-bottom: 1px solid #bdbdbd;
background-image: linear-gradient(to bottom, #ececec 1px, transparent 1px);
background-size: 100% 25%;
}
.juridica-grafico-barras {
display: flex;
align-items: flex-end;
gap: 6px;
height: 100%;
margin: 0;
padding: 0 4px;
list-style: none;
}
.juridica-grafico-barras li {
position: relative;
flex: 1 1 0;
height: 100%;
display: flex;
align-items: flex-end;
}
.juridica-grafico-barra {
display: block;
width: 100%;
min-height: 0;
background: #403027;
opacity: .85;
transition: opacity .15s ease;
}
.juridica-grafico-barras li:hover .juridica-grafico-barra { opacity: 1; }
.juridica-grafico-mes {
position: absolute;
left: 50%;
bottom: -21px;
transform: translateX(-50%);
font-size: 12px;
color: #666666;
}
/* =========================================================
BLOQUE "ARTÍCULOS MÁS CONSULTADOS"
(plugin de bloque juridicaMasConsultados)
========================================================= */
.pkp_structure_sidebar .block_juridica_mas_consultados .title::before {
content: "";
background-image: url("data:image/svg+xml;utf8,");
}
.block_juridica_mas_consultados ol {
margin: 0;
padding: 0;
list-style: none;
text-align: center;
}
.block_juridica_mas_consultados li { margin: 0 0 16px 0; line-height: 1.4; }
.block_juridica_mas_consultados .vistas {
display: inline-flex;
align-items: center;
gap: 5px;
margin-top: 3px;
font-size: 14px;
font-weight: 700;
color: #333333;
}
.block_juridica_mas_consultados .vistas::before {
content: "";
width: 16px;
height: 16px;
background: url("data:image/svg+xml;utf8,") center / contain no-repeat;
}
@media (max-width: 767px) {
.juridica-grafico-cuerpo { max-width: 100%; }
.juridica-grafico-mes { font-size: 10px; }
}
/* =========================================================
ARTÍCULO A DOS COLUMNAS REALES (v2.3)
El tema padre coloca los detalles con float; con el ancho de la
columna principal de Juridica el bloque caía al final de la página.
Con flex, los detalles (portada, galeradas, fecha, número, licencia,
cómo citar, compartir...) quedan siempre a la derecha del resumen.
========================================================= */
@media (min-width: 992px) {
.obj_article_details .row {
display: flex !important;
flex-wrap: nowrap !important;
align-items: stretch;
margin-left: 0 !important;
margin-right: 0 !important;
}
.obj_article_details .row::before,
.obj_article_details .row::after {
display: none !important;
content: none !important;
}
.obj_article_details .main_entry {
float: none !important;
flex: 1 1 auto;
width: auto !important;
min-width: 0;
padding-right: 30px;
border-right: 1px solid #e3e3e3;
}
.obj_article_details .entry_details {
float: none !important;
flex: 0 0 34%;
width: 34% !important;
max-width: 300px;
min-width: 0;
margin: 0 !important;
border-left: none !important;
}
}
.obj_article_details .entry_details { overflow-wrap: anywhere; }
/* Nota bajo el icono de galerada, p. ej. "inglés" */
.obj_article_details .galleys_links li {
display: flex;
flex-direction: column;
align-items: center;
gap: 4px;
}
.juridica-galerada-nota {
font-size: 12px;
line-height: 1.2;
color: #403027;
text-align: center;
}
/* Botones de compartir y selector de citas a lo ancho de la columna */
.obj_article_details .entry_details .citation_formats,
.obj_article_details .entry_details select { max-width: 100%; }
/* =========================================================
MENÚ EN TIPO ORACIÓN (v2.3)
"REDES SOCIALES" / "Redes Sociales" -> "Redes sociales".
Se pasa todo a minúscula y se pone en mayúscula sólo la
primera letra de cada opción.
========================================================= */
.pkp_navigation_primary > li > a {
text-transform: lowercase !important;
letter-spacing: 0 !important;
}
.pkp_navigation_primary > li > a::first-letter {
text-transform: uppercase;
}
/* =========================================================
BOTONES DE COMPARTIR (plugin Shariff) CON COLOR DE MARCA
Fondo lleno con el color de cada red, icono y texto blancos,
en rejilla de dos columnas. Funciona con cualquier tema de
Shariff (estándar, gris o blanco) elegido en el plugin.
========================================================= */
.shariff ul {
display: flex !important;
flex-wrap: wrap !important;
gap: 6px !important;
margin: 0 !important;
padding: 0 !important;
list-style: none !important;
}
.shariff ul li,
.shariff ul li.shariff-button {
flex: 0 0 calc(50% - 3px) !important;
width: calc(50% - 3px) !important;
max-width: none !important;
margin: 0 !important;
height: auto !important;
border: none !important;
border-radius: 0 !important;
overflow: hidden;
}
.shariff ul li a {
display: flex !important;
align-items: center;
gap: 8px;
height: 34px !important;
padding: 0 10px !important;
border: none !important;
border-radius: 0 !important;
color: #ffffff !important;
font-size: 14px !important;
font-weight: 700;
text-decoration: none !important;
transition: filter .15s ease;
}
.shariff ul li a:hover,
.shariff ul li a:focus { filter: brightness(1.12); color: #ffffff !important; }
.shariff ul li a *,
.shariff ul li a .fab,
.shariff ul li a .fas,
.shariff ul li a .share_text { color: #ffffff !important; }
.shariff ul li a svg,
.shariff ul li a svg path { fill: #ffffff !important; }
.shariff ul li a .fab,
.shariff ul li a .fas,
.shariff ul li a svg { width: 20px; font-size: 20px !important; text-align: center; }
/* Colores de cada red */
.shariff li.twitter a, .shariff li.x a { background-color: #000000 !important; }
.shariff li.facebook a { background-color: #3b5998 !important; }
.shariff li.linkedin a { background-color: #0077b5 !important; }
.shariff li.whatsapp a { background-color: #5cbe4a !important; }
.shariff li.mail a { background-color: #999999 !important; }
.shariff li.telegram a { background-color: #0088cc !important; }
.shariff li.threema a { background-color: #333333 !important; }
.shariff li.xing a { background-color: #126567 !important; }
.shariff li.reddit a { background-color: #ff4500 !important; }
.shariff li.pinterest a { background-color: #cb2027 !important; }
.shariff li.tumblr a { background-color: #36465d !important; }
.shariff li.bluesky a { background-color: #1185fe !important; }
.shariff li.mastodon a { background-color: #6364ff !important; }
.shariff li.info a,
.shariff li.print a { background-color: #666666 !important; }
/* =========================================================
GRÁFICO DE DESCARGAS - AJUSTE v2.3
Las cifras del eje se colocan exactamente sobre cada línea
de la cuadrícula (antes podían quedar desplazadas).
========================================================= */
.juridica-grafico-cuerpo {
display: block;
position: relative;
padding: 0 0 22px 46px;
}
.juridica-grafico-zona { height: 100%; }
.juridica-grafico-eje {
position: absolute;
top: 0;
bottom: 0;
right: 100%;
width: 42px;
margin: 0 !important;
padding: 0 6px 0 0 !important;
list-style: none;
}
.juridica-grafico-eje li {
position: absolute;
right: 6px;
margin: 0 !important;
padding: 0 !important;
line-height: 1;
transform: translateY(-50%);
white-space: nowrap;
}
.juridica-grafico-eje li::before { content: none !important; }
/* =========================================================
OCULTAR EL GRÁFICO DUPLICADO DEL PLUGIN DE ESTADÍSTICAS
El tema ya muestra su propio gráfico "Descargas". Lo ideal es
desactivar también la opción en el plugin de estadísticas de
uso, para que la página no cargue Chart.js sin necesidad.
========================================================= */
.obj_article_details .item.downloads_chart,
.obj_article_details .item:has(canvas.usageStatsGraph) {
display: none !important;
}
/* =========================================================
INSIGNIAS DE CITAS (v2.4): OpenAlex y Google Académico
Diseño propio y circular, en línea con las de Dimensions/PlumX.
========================================================= */
.juridica-insignias {
display: flex;
flex-wrap: wrap;
gap: 18px 26px;
align-items: flex-start;
}
.juridica-insignias-fusionadas { margin-top: 22px; }
.juridica-insignia {
display: inline-flex;
flex-direction: column;
align-items: center;
gap: 6px;
width: 76px;
color: #403027 !important;
text-decoration: none !important;
text-align: center;
}
.juridica-insignia[hidden] { display: none !important; }
.juridica-insignia-circulo {
display: flex;
align-items: center;
justify-content: center;
width: 64px;
height: 64px;
border-radius: 50%;
background: #ffffff;
box-shadow: 0 2px 8px rgba(0, 0, 0, .15);
transition: transform .15s ease;
}
.juridica-insignia:hover .juridica-insignia-circulo,
.juridica-insignia:focus .juridica-insignia-circulo { transform: scale(1.06); }
.juridica-insignia-nombre {
font-size: 12px;
line-height: 1.2;
font-weight: 600;
}
/* OpenAlex: anillo en degradado con el número de citas al centro */
.juridica-insignia-openalex .juridica-insignia-circulo {
background:
radial-gradient(circle, #ffffff 0 22px, transparent 23px),
conic-gradient(#403027, #1f6fb2, #37b3c9, #7bd389, #37b3c9, #1f6fb2, #403027);
}
.juridica-insignia-numero {
font-size: 17px;
font-weight: 700;
color: #403027;
font-variant-numeric: tabular-nums;
}
/* Google Académico: birrete dentro de un aro azul */
.juridica-insignia-scholar .juridica-insignia-circulo {
border: 5px solid #1f6fb2;
background: #ffffff url("data:image/svg+xml;utf8,") center / 34px 34px no-repeat;
box-sizing: border-box;
}
/* =========================================================
BLOQUE "NÚMEROS PUBLICADOS": PORTADAS QUE GIRAN (v2.4)
(plugin de bloque juridicaPortadas)
========================================================= */
.pkp_structure_sidebar .block_juridica_portadas .title::before {
content: "";
background-image: url("data:image/svg+xml;utf8,");
}
.juridica-portadas { text-align: center; }
.juridica-portadas-escena {
position: relative;
width: 100%;
max-width: 210px;
aspect-ratio: 210 / 297;
margin: 6px auto 0 auto;
perspective: 1200px;
}
.juridica-portada {
position: absolute;
inset: 0;
display: block;
visibility: hidden;
backface-visibility: hidden;
transform-origin: center center;
}
.juridica-portada img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 6px;
box-shadow: 0 8px 18px rgba(0, 0, 0, .28);
}
.juridica-portada.activa {
visibility: visible;
animation: juridicaPortadaEntra .8s ease-out both;
}
.juridica-portada.saliendo {
visibility: visible;
animation: juridicaPortadaSale .4s ease-in both;
}
@keyframes juridicaPortadaSale {
from { transform: rotateY(0deg); }
to { transform: rotateY(-90deg); }
}
@keyframes juridicaPortadaEntra {
0%, 50% { transform: rotateY(90deg); }
100% { transform: rotateY(0deg); }
}
.juridica-portadas-leyenda {
min-height: 2.6em;
margin: 14px 0 0 0;
font-size: 14px;
font-weight: 600;
line-height: 1.3;
color: #403027;
}
.juridica-portadas-puntos {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 7px;
margin-top: 8px;
}
.juridica-portadas-puntos button {
width: 10px;
height: 10px;
padding: 0;
border: 2px solid #403027;
border-radius: 50%;
background: transparent;
cursor: pointer;
}
.juridica-portadas-puntos button[aria-current="true"] { background: #403027; }
@media (prefers-reduced-motion: reduce) {
.juridica-portada.activa,
.juridica-portada.saliendo { animation: none; }
.juridica-portada.saliendo { visibility: hidden; }
}
/* =========================================================
INSIGNIAS DE TERCEROS (v2.5): Dimensions, PlumX, Altmetric
Mismo tamaño y alineación que las de OpenAlex / Google Académico.
========================================================= */
.juridica-insignia-externa {
min-height: 64px;
color: #403027;
}
.juridica-insignia-externa > :first-child {
display: flex !important;
align-items: center;
justify-content: center;
min-width: 64px;
min-height: 64px;
}
.juridica-insignia-externa .altmetric-embed img { width: 64px; height: 64px; }
.juridica-insignia-externa .plumx-plum-print-popup { font-size: 0; }
/* Las ventanas emergentes de los servicios deben quedar por encima */
.juridica-insignias { position: relative; z-index: 2; }
/* Leyenda bajo cada icono de galerada (v2.5.1) */
.juridica-galerada-nota {
font-size: 13px;
font-weight: 600;
white-space: nowrap;
}
/* =========================================================
PIE DE PÁGINA INSTITUCIONAL v2.6
Fondo azul de la revista, logo blanco de la Universidad
Americana y datos de la revista centrados.
========================================================= */
.pkp_structure_footer_wrapper,
.pkp_structure_footer,
.pkp_brand_footer { display: none !important; }
.footer-institucional {
background-color: #403027;
color: #ffffff;
padding: 50px 20px 30px 20px;
text-align: center;
}
.footer-institucional .footer-contenido {
max-width: 900px;
margin: 0 auto;
}
.footer-institucional p {
margin: 0 0 10px 0;
font-size: 15px;
line-height: 1.6;
color: #e8edf5;
text-align: center;
}
.footer-institucional a { color: #ffffff; text-decoration: underline; font-weight: 400; }
.footer-institucional a:hover,
.footer-institucional a:focus { color: #cfe0ff; }
.footer-revista .footer-titulo {
font-size: 17px;
font-weight: 700;
color: #ffffff;
}
.footer-separador { margin: 0 8px; opacity: .6; }
.footer-universidad { margin: 28px 0; }
.footer-universidad img {
display: inline-block;
width: 240px;
max-width: 70%;
height: auto;
}
.footer-legal {
padding: 22px 0;
border-top: 1px solid rgba(255, 255, 255, .18);
border-bottom: 1px solid rgba(255, 255, 255, .18);
}
.footer-legal p { font-size: 13px; text-align: center; }
.footer-institucional .footer-licencia {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 12px;
margin: 22px 0 0 0;
}
.footer-institucional .footer-licencia p { margin: 0; font-size: 14px; }
.footer-sellos {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 10px;
margin: 26px 0 0 0;
padding: 0;
list-style: none;
}
.footer-sellos li {
padding: 5px 14px;
border: 1px solid rgba(255, 255, 255, .45);
border-radius: 20px;
font-size: 13px;
font-weight: 600;
letter-spacing: .3px;
}
.footer-ojs {
margin-top: 30px;
font-size: 13px;
}
.footer-ojs a { text-decoration: none; opacity: .8; }
.footer-ojs a:hover { opacity: 1; text-decoration: underline; }
/* Botón "volver arriba" en el azul de la revista */
.volver-arriba { border-color: #403027 !important; color: #403027 !important; }
.volver-arriba:hover { background-color: #403027 !important; color: #ffffff !important; }
/* =========================================================
MENÚ PRINCIPAL: CONTRASTE AL ABRIR SUBMENÚS (v2.6.1)
El tema padre pinta de blanco la opción cuyo submenú está
abierto; con el texto blanco del tema Juridica, la opción
desaparecía. Se mantiene el fondo azul y se marca con la
misma línea inferior blanca que la opción activa.
========================================================= */
.pkp_navigation_primary > li:hover > a,
.pkp_navigation_primary > li:focus-within > a,
.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_primary > li > a[aria-expanded="true"],
.pkp_navigation_primary > li.in_focus > a,
.pkp_navigation_primary > li.open > a,
.pkp_navigation_primary > li.show > a {
background: rgba(255, 255, 255, .10) !important;
color: #ffffff !important;
border-color: transparent !important;
box-shadow: inset 0 -3px 0 #ffffff;
text-decoration: none;
}
/* Flecha del desplegable siempre blanca */
.pkp_navigation_primary > li > a::after,
.pkp_navigation_primary > li > a .dropdown-toggle,
.pkp_navigation_primary > li > a[aria-haspopup]::after {
border-top-color: #ffffff !important;
color: #ffffff !important;
}
/* Foco visible con teclado */
.pkp_navigation_primary > li > a:focus-visible {
outline: 2px solid #ffffff;
outline-offset: 2px;
}
/* =========================================================
OVERRIDES FINALES v2.6.6 - BANNER CENTRADO Y PROPORCIONAL
Logo visto completo (contain), más chico, centrado,
con fondo del header en el mismo azul del banner JPG.
========================================================= */
/* --- Fondo azul UNIFICADO en wrapper y en el header completo --- */
html body .pkp_structure_head,
html body .pkp_site_name_wrapper,
html body .pkp_head_wrapper {
background-color: #403027 !important;
}
/* --- Banner reducido, contain para no deformar, centrado --- */
html body .pkp_site_name,
html body .pkp_site_name a,
html body .pkp_site_name .is_text,
html body .pkp_site_name .is_img,
html body .pkp_site_name > a {
aspect-ratio: auto !important;
height: 150px !important;
max-height: 150px !important;
min-height: 0 !important;
width: 100% !important;
background-color: #403027 !important;
background-image: url('../images/cab_juridica.svg') !important;
background-size: contain !important;
background-position: center center !important;
background-repeat: no-repeat !important;
padding: 0 !important;
margin: 0 !important;
}
@media (max-width: 1200px) {
html body .pkp_site_name,
html body .pkp_site_name a,
html body .pkp_site_name .is_text,
html body .pkp_site_name .is_img,
html body .pkp_site_name > a {
height: 110px !important;
max-height: 110px !important;
}
}
@media (max-width: 767px) {
html body .pkp_site_name,
html body .pkp_site_name a,
html body .pkp_site_name .is_text,
html body .pkp_site_name .is_img,
html body .pkp_site_name > a {
height: 70px !important;
max-height: 70px !important;
}
}
/* --- Títulos del sidebar: azul del menú (#593622) con texto BLANCO --- */
html body .pkp_structure_sidebar .pkp_block .title,
html body .pkp_structure_sidebar .pkp_block > .title,
html body .pkp_structure_sidebar .pkp_block h2.title,
html body .pkp_structure_sidebar .pkp_block h3.title,
html body .pkp_structure_sidebar .pkp_block .pkp_block_header,
html body #sidebar .pkp_block .title,
html body #sidebar .pkp_block h2,
html body #sidebar .pkp_block h3 {
background-color: #593622 !important;
background-image: none !important;
color: #ffffff !important;
border: none !important;
border-bottom: none !important;
padding: 10px 14px !important;
margin: 0 0 15px 0 !important;
border-radius: 3px !important;
text-align: left !important;
font-size: 15px !important;
font-weight: 700 !important;
text-transform: uppercase !important;
letter-spacing: 0.5px !important;
text-shadow: none !important;
box-shadow: none !important;
}
html body .pkp_structure_sidebar .pkp_block .title a,
html body .pkp_structure_sidebar .pkp_block .title span {
color: #ffffff !important;
text-decoration: none !important;
}
html body .pkp_structure_sidebar .pkp_block .title::before {
filter: brightness(0) invert(1) !important;
vertical-align: -5px !important;
opacity: 1 !important;
}
/* =========================================================
ACCESIBILIDAD v2.6.9
Contraste y refuerzos para WCAG 2.1 AA en el pie, en la
barra superior y en el enlace "Buscar" del menú.
========================================================= */
/* "Buscar" del menú principal: texto blanco puro sobre azul
#403027 (ratio 11.2:1). Antes heredaba un gris claro que
bajaba el contraste por debajo de 4.5:1. */
html body .pkp_navigation_primary_row .pkp_navigation_search_wrapper a,
html body .pkp_navigation_primary_row .pkp_navigation_search_wrapper .pkp_search a,
html body .pkp_navigation_primary_row .pkp_navigation_search a,
html body .pkp_navigation_primary_row a.search_prompt,
html body .pkp_head_wrapper .pkp_navigation_primary_row a {
color: #ffffff !important;
opacity: 1 !important;
text-shadow: none !important;
}
html body .pkp_navigation_primary_row .pkp_navigation_search_wrapper a:hover,
html body .pkp_navigation_primary_row .pkp_navigation_search_wrapper a:focus-visible {
color: #ffffff !important;
text-decoration: underline;
outline: 2px solid #ffffff;
outline-offset: 2px;
}
/* "Volver arriba" sobre el pie azul: texto blanco con sombra
para asegurar 4.5:1 también cuando pasa sobre el banner. */
html body .volver-arriba {
color: #ffffff !important;
border-color: #ffffff !important;
background: rgba(11, 42, 91, 0.85) !important;
text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
}
html body .volver-arriba:hover,
html body .volver-arriba:focus-visible {
background: #ffffff !important;
color: #403027 !important;
outline: 2px solid #ffffff;
outline-offset: 2px;
}
/* El separador tipográfico del título del pie no debe quedar
leído por los lectores de pantalla. */
.footer-separador { user-select: none; }
/* Último sello: elimina resquicios del pie por defecto que
algunas instalaciones de OJS inyectan por JavaScript. */
html body .pkp_structure_footer_wrapper,
html body #pkp_structure_footer_wrapper,
html body .pkp_structure_footer,
html body #pkp_structure_footer,
html body .pkp_structure_footer_wrapper * ,
html body #pkp_structure_footer_wrapper * {
display: none !important;
}
/* =========================================================
REVISTA JURÍDICA - PERSONALIZACIONES ESPECÍFICAS (v1.0)
Paleta de colores oficial, basada en el CSS proporcionado
por la revista:
#403027 marrón oscuro principal (header, sidebar titles)
#593622 marrón medio (barra inferior, bordes)
#8C603A marrón dorado medio (botón "Enviar un artículo")
#BFA26B borde dorado claro (borde del botón envío)
========================================================= */
/* --- Fondo principal (banner y menú) en marrón oscuro --- */
html body .pkp_structure_head,
html body .pkp_site_name_wrapper,
html body .pkp_head_wrapper,
html body .pkp_navigation_primary_row {
background-color: #403027 !important;
}
/* --- Banner con el logo SVG de la Revista Jurídica,
centrado y proporcional --- */
html body .pkp_site_name,
html body .pkp_site_name a,
html body .pkp_site_name .is_text,
html body .pkp_site_name .is_img,
html body .pkp_site_name > a {
background-color: #403027 !important;
background-image: url('../images/cab_juridica.svg') !important;
background-size: contain !important;
background-position: center center !important;
background-repeat: no-repeat !important;
}
/* --- BOTÓN "ENVIAR UN ARTÍCULO" ESTILO JURÍDICA ---
Fondo marrón dorado con borde beige, texto blanco en MAYÚSCULAS.
(Según CSS que proporcionó la revista.)
========================================================= */
html body .pkp_structure_sidebar .block_make_submission .content a,
html body .pkp_structure_sidebar .block_make_submission a.cmp_button,
html body .pkp_structure_sidebar a.block_make_submission_link,
html body .pkp_structure_sidebar .pkp_block a.cmp_button,
html body .pkp_structure_sidebar a.cmp_button {
display: flex !important;
align-items: center;
justify-content: center;
gap: 10px;
width: 100% !important;
box-sizing: border-box;
padding: 1em 2em !important;
background: #8C603A !important;
background-image: none !important;
border: 3px solid #BFA26B !important;
border-radius: 2.5em !important;
color: #FFFFFF !important;
font-weight: 700 !important;
font-size: 1.125em !important;
text-align: center;
text-transform: uppercase !important;
text-decoration: none !important;
box-shadow: none !important;
text-shadow: none !important;
letter-spacing: 0.5px;
transition: background-color .2s ease, transform .15s ease;
}
html body .pkp_structure_sidebar .block_make_submission .content a:hover,
html body .pkp_structure_sidebar .block_make_submission a.cmp_button:hover,
html body .pkp_structure_sidebar a.block_make_submission_link:hover,
html body .pkp_structure_sidebar .pkp_block a.cmp_button:hover,
html body .pkp_structure_sidebar a.cmp_button:hover,
html body .pkp_structure_sidebar .block_make_submission .content a:focus,
html body .pkp_structure_sidebar a.cmp_button:focus {
background: #593622 !important;
color: #FFFFFF !important;
border-color: #BFA26B !important;
transform: translateY(-1px);
}
/* Reemplazar el icono azul del botón enviar artículo por un icono blanco */
html body .pkp_structure_sidebar .block_make_submission .content a::before,
html body .pkp_structure_sidebar a.cmp_button::before {
content: "";
flex: 0 0 auto;
width: 22px;
height: 22px;
background: url("data:image/svg+xml;utf8,") center/contain no-repeat !important;
filter: none !important;
}
html body .pkp_structure_sidebar .block_make_submission .content a:hover::before,
html body .pkp_structure_sidebar a.cmp_button:hover::before {
filter: none !important;
}
/* --- Botones genéricos del sidebar con color marrón --- */
.pkp_structure_sidebar .sidebar-btn,
.pkp_structure_sidebar .block_make_submission_link {
background: #ffffff;
border: 2px solid #403027;
color: #403027 !important;
}
.pkp_structure_sidebar .sidebar-btn:hover,
.pkp_structure_sidebar .block_make_submission_link:hover {
background: #403027;
color: #ffffff !important;
}
/* --- Todos los enlaces (según CSS de la revista) --- */
body a:not(.pkp_navigation_primary > li > a):not(.cmp_button):not(.block_make_submission_link) {
color: #403027;
}
/* =========================================================
PIE DE PÁGINA INSTITUCIONAL REVISTA JURÍDICA
Marrón oscuro con sellos y logos centrados.
========================================================= */
.footer-institucional {
background-color: #403027 !important;
color: #ffffff;
padding: 50px 20px 30px 20px;
text-align: center;
}
.footer-institucional .footer-contenido {
max-width: 900px;
margin: 0 auto;
}
.footer-institucional p {
margin: 0 0 10px 0;
font-size: 15px;
line-height: 1.6;
color: #f0e9e0;
text-align: center;
}
.footer-institucional a {
color: #ffffff !important;
text-decoration: underline;
font-weight: 400;
}
.footer-institucional a:hover,
.footer-institucional a:focus {
color: #d4c4b0 !important;
}
.footer-revista .footer-titulo {
font-size: 17px;
font-weight: 700;
color: #ffffff;
margin-bottom: 8px;
}
.footer-licencia-linea {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 8px;
font-size: 14px;
margin-top: 10px;
}
.footer-licencia-linea img {
vertical-align: middle;
display: inline-block;
}
.footer-legal {
padding: 22px 0;
border-top: 1px solid rgba(255, 255, 255, .18);
border-bottom: 1px solid rgba(255, 255, 255, .18);
margin: 22px 0;
}
.footer-legal p {
font-size: 14px;
text-align: center;
margin: 0 0 10px 0;
}
.footer-universidad {
margin: 22px 0;
text-align: center;
}
.footer-universidad img {
display: inline-block;
width: 240px;
max-width: 70%;
height: auto;
}
/* Fila de logos / sellos del pie, al estilo .footer-logos original */
.footer-institucional .footer-logos {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
gap: 24px;
padding: 20px 10px;
margin: 20px 0 0 0;
background-color: rgba(0, 0, 0, 0.15);
border-radius: 6px;
border: none;
}
.footer-institucional .footer-logos a {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 45px;
text-decoration: none;
}
.footer-institucional .footer-logos img {
display: inline-block;
vertical-align: middle;
max-height: 45px;
width: auto;
}
/* Sello textual (DOI, OPEN ACCESS) cuando no se tiene imagen oficial */
.footer-institucional .footer-sello-texto {
display: inline-block;
padding: 8px 16px;
border: 2px solid #ffffff;
border-radius: 3px;
font-size: 13px;
font-weight: 700;
letter-spacing: 1px;
color: #ffffff;
background: transparent;
text-transform: uppercase;
}
.footer-institucional .footer-logos a:hover .footer-sello-texto {
background: #ffffff;
color: #403027;
}
.footer-ojs {
margin-top: 25px;
font-size: 13px;
}
.footer-ojs a {
text-decoration: none;
opacity: .9;
}
.footer-ojs a:hover {
opacity: 1;
text-decoration: underline;
}
/* "Volver arriba" con la paleta marrón */
html body .volver-arriba {
color: #ffffff !important;
border-color: #ffffff !important;
background: rgba(64, 48, 39, 0.9) !important;
}
html body .volver-arriba:hover,
html body .volver-arriba:focus-visible {
background: #ffffff !important;
color: #403027 !important;
outline: 2px solid #ffffff;
outline-offset: 2px;
}
/* --- TÍTULOS DEL SIDEBAR en marrón medio #593622 --- */
html body .pkp_structure_sidebar .pkp_block .title,
html body .pkp_structure_sidebar .pkp_block > .title,
html body .pkp_structure_sidebar .pkp_block h2.title,
html body .pkp_structure_sidebar .pkp_block h3.title,
html body .pkp_structure_sidebar .pkp_block .pkp_block_header,
html body #sidebar .pkp_block .title,
html body #sidebar .pkp_block h2,
html body #sidebar .pkp_block h3 {
background-color: #403027 !important;
background-image: none !important;
border-top: 8px solid #593622 !important;
color: #ffffff !important;
border-radius: 0 !important;
}
/* --- "Buscar" del menú principal: contraste sobre marrón --- */
html body .pkp_navigation_primary_row .pkp_navigation_search_wrapper a,
html body .pkp_navigation_primary_row .pkp_navigation_search_wrapper .pkp_search a,
html body .pkp_navigation_primary_row .pkp_navigation_search a,
html body .pkp_navigation_primary_row a.search_prompt,
html body .pkp_head_wrapper .pkp_navigation_primary_row a {
color: #ffffff !important;
opacity: 1 !important;
text-shadow: none !important;
}
/* --- Submenús desplegables sobre fondo marfil cálido --- */
.pkp_navigation_primary > li > ul {
background: #faf6f0 !important;
border: 1px solid #d9cfc0 !important;
}
.pkp_navigation_primary > li > ul li a {
color: #403027 !important;
}
.pkp_navigation_primary > li > ul li a:hover {
background: #efe6d8 !important;
}
/* --- Logo del Americana en el footer con tamaño más controlado --- */
.footer-universidad img[alt="Universidad Americana"] {
filter: brightness(0) invert(1);
opacity: 0.95;
}
/* --- Responsive --- */
@media (max-width: 767px) {
.footer-institucional .footer-logos {
gap: 12px;
padding: 15px 8px;
}
.footer-institucional .footer-logos img {
max-height: 35px;
}
.footer-licencia-linea {
flex-direction: column;
}
}