/* Hoja de estilos del PORTAL (sitio) - Manuscript.
   Banner: public/site/bg.png (4226x629). La hoja anterior de la 3.1 (bootstrap3) quedó en sitestyle.css.bak-3.1 */

/* === Cabecera del portal: banner (bg.png) === */
.pkp_structure_head {
	border-bottom: none;
	padding: 0;
}

.pkp_head_wrapper {
	padding: 0;
	margin: 0 auto;
	width: 100% !important;
	max-width: 100% !important;
}

.pkp_site_name_wrapper,
.pkp_navigation_primary_wrapper,
.pkp_navigation_user,
.pkp_search_mobile {
	width: 100% !important;
	max-width: 100% !important;
}

/* Solo en el PORTAL: la hoja del sitio se carga también en las revistas y no debe pisar su cabecera */
.pkp_site_name_wrapper:has(a[href*="/index.php/index/index"]) {
	background-image: url('bg_site.png');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	aspect-ratio: 4226 / 629;
	display: flex;
	align-items: center;
	padding: 0;
	margin: 0;
}

/* El nombre del portal ya viene dentro de la imagen del banner */
.pkp_site_name_wrapper:has(a[href*="/index.php/index/index"]) .pkp_site_name .is_text,
.pkp_site_name_wrapper:has(a[href*="/index.php/index/index"]) .pkp_site_name .is_img {
	opacity: 0;
}

/* "Registrarse / Entrar" legible sobre el banner */
.pkp_navigation_user_wrapper {
	background: rgba(0, 0, 0, 0.55);
	border-radius: 4px;
	padding-top: 6px !important;
	padding-bottom: 6px !important;
}

.pkp_navigation_user_wrapper > ul.pkp_navigation_user > li > a {
	color: #fff;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}

/* Submenús desplegables: texto normal sobre fondo blanco */
.pkp_navigation_user_wrapper ul ul a {
	color: inherit;
	text-shadow: none;
}

/* === fin cabecera del portal === */

/* === Portada del portal: espacio bajo el banner === */
.page_index_site {
	padding-top: 2rem;
}

.page_index_site .about_site {
	margin-top: 0;
}
/* === fin espacio bajo el banner === */

/* === Portal: revistas en dos columnas === */
@media (min-width: 768px) {
	.pkp_page_index .page_index_site .journals > ul {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.5rem;
		align-items: start;
	}

	.pkp_page_index .page_index_site .journals > ul > li {
		margin: 0;
		padding: 1.25rem;
		border: 1px solid #e5e5e5;
		border-radius: 4px;
	}

	/* Miniatura y texto lado a lado, ajustados al ancho de media columna */
	.pkp_page_index .page_index_site .journals .thumb {
		width: 35%;
		padding-right: 1rem;
	}

	.pkp_page_index .page_index_site .journals .thumb + .body {
		width: 65%;
	}
}
/* === fin revistas en dos columnas === */

/* === Menú móvil lateral (igual que preview) === */
/* ===== Mobile: slide-in side drawer menu instead of the stock dropdown ===== */
@media (max-width: 991px) {

	/* Let the banner breathe instead of being squashed to 40px */
	.pkp_site_name_wrapper {
		height: auto !important;
	}

	.pkp_site_nav_toggle {
		z-index: 100000 !important;
		background: #000 !important;
		width: 3.8rem !important;
		height: 3.8rem !important;
	}

	.pkp_site_nav_toggle > span {
		width: 32px !important;
		height: 26px !important;
		border-bottom-width: 4px !important;
	}

	.pkp_site_nav_toggle > span:before,
	.pkp_site_nav_toggle > span:after {
		height: 4px !important;
	}

	.pkp_site_nav_menu {
		position: fixed !important;
		top: 0 !important;
		right: -85% !important;
		left: auto !important;
		width: 85% !important;
		max-width: 320px !important;
		height: 100vh !important;
		overflow-y: auto !important;
		background: #141414 !important;
		z-index: 99999 !important;
		padding: 4.5rem 0 2rem !important;
		transition: right 0.3s ease;
		box-shadow: -6px 0 24px rgba(0, 0, 0, 0.45);
	}

	.pkp_site_nav_menu.pkp_site_nav_menu--isOpen {
		right: 0 !important;
	}

	/* Dim the page behind the open drawer */
	body:has(.pkp_site_nav_menu--isOpen)::after {
		content: "";
		position: fixed;
		inset: 0;
		background: rgba(0, 0, 0, 0.5);
		z-index: 99998;
	}

	.pkp_navigation_primary_row,
	.pkp_navigation_user_wrapper {
		background: transparent !important;
		width: 100% !important;
		padding: 0 1.25rem !important;
	}

	.pkp_site_nav_menu a {
		color: #fff !important;
		text-shadow: none !important;
	}

	.pkp_site_nav_menu ul ul a {
		color: #ccc !important;
	}

	.pkp_navigation_primary > li,
	.pkp_navigation_user > li {
		border-bottom: 1px solid rgba(255, 255, 255, 0.12);
	}
}
/* === fin menú móvil lateral === */

/* === menú Registrarse/Entrar: fondo oscuro ajustado al contenido (menu-angosto) === */
@media (min-width: 992px) {
	.pkp_navigation_user_wrapper {
		width: auto !important;
		min-width: 0 !important;
		left: auto !important;
		padding-left: 1.25rem !important;
		padding-right: 1.25rem !important;
	}
}
/* === fin menu-angosto === */

/* === logo OJS del pie más pequeño (logo-pie-pequeno) === */
.pkp_brand_footer a {
	max-width: 90px;
}
/* === fin logo-pie-pequeno === */

/* === logo OJS One junto al de OJS/PKP en el pie, con enlace (logo-ojs-one) === */
.pkp_brand_footer {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 1.75rem;
}
.pkp_brand_footer:after {
	display: none;
}
.pkp_brand_footer a {
	order: 1;
	float: none;
}
.pkp_brand_footer a.brand_ojsone {
	order: 3;
	flex: 0 0 120px;
	width: 120px;
	max-width: 120px;
}
.pkp_brand_footer a.brand_ojsone img {
	display: block;
	width: 100%;
	height: auto;
}
/* === fin logo-ojs-one === */
