/**
 * Modern News UI — Cabecera.
 * Solo actúa sobre elementos marcados por el plugin (.mnui-header).
 * Al desactivar el plugin, ninguna de estas reglas se carga.
 */

.mnui-header {
	transition: transform var(--mnui-transition), box-shadow var(--mnui-transition),
		padding var(--mnui-transition), background-color var(--mnui-transition);
	will-change: transform;
}

.mnui-header--fixed {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 9990;
	background-color: var(--mnui-header-bg, #fff);
}

.admin-bar .mnui-header--fixed {
	top: 32px;
}

@media screen and (max-width: 782px) {
	.admin-bar .mnui-header--fixed {
		top: 46px;
	}
}

.mnui-header--scrolled {
	box-shadow: var(--mnui-shadow-soft);
}

.mnui-header--compact {
	padding-top: calc(var(--mnui-space-xs) / 1.5);
	padding-bottom: calc(var(--mnui-space-xs) / 1.5);
}

.mnui-header--hidden {
	transform: translate3d(0, -100%, 0);
}

.mnui-header-spacer {
	display: block;
	width: 100%;
	flex: none;
}

/* Botón de búsqueda añadido por el plugin. */

.mnui-header__search {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin-inline-start: var(--mnui-space-xs);
	border: 0;
	border-radius: var(--mnui-radius-button);
	background: transparent;
	color: currentColor;
	cursor: pointer;
	line-height: 0;
	transition: background-color var(--mnui-transition), color var(--mnui-transition);
}

.mnui-header__search:hover,
.mnui-header__search:focus-visible {
	background: color-mix(in srgb, var(--mnui-color-accent) 12%, transparent);
	color: var(--mnui-color-accent);
}

.mnui-header__search svg {
	width: 20px;
	height: 20px;
}

/* Buscador a pantalla completa. */

.mnui-search[hidden] {
	display: none;
}

.mnui-search {
	position: fixed;
	inset: 0;
	z-index: 99990;
	display: flex;
	align-items: flex-start;
	justify-content: center;
}

.mnui-search__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(15, 23, 42, 0.55);
	backdrop-filter: blur(4px);
	animation: mnui-fade var(--mnui-transition) both;
}

.mnui-search__panel {
	position: relative;
	width: min(680px, calc(100% - 2rem));
	margin-top: min(18vh, 180px);
	padding: var(--mnui-space-lg);
	background: #fff;
	border-radius: var(--mnui-radius-card);
	box-shadow: 0 24px 60px rgba(15, 23, 42, 0.25);
	animation: mnui-rise var(--mnui-transition) both;
}

.mnui-search__close {
	position: absolute;
	top: 10px;
	right: 14px;
	border: 0;
	background: transparent;
	font-size: 28px;
	line-height: 1;
	color: #64748b;
	cursor: pointer;
}

.mnui-search__form input[type="search"],
.mnui-search__form input[type="text"] {
	width: 100%;
	padding: var(--mnui-space-sm) var(--mnui-space-md);
	font-size: 1.15rem;
	font-family: var(--mnui-font-body);
	border: 1px solid #e2e8f0;
	border-radius: var(--mnui-radius-input);
	background: #f8fafc;
}

.mnui-search__form input[type="search"]:focus,
.mnui-search__form input[type="text"]:focus {
	outline: 2px solid var(--mnui-color-accent);
	outline-offset: 1px;
	background: #fff;
}

.mnui-search__form label { display: block; }
.mnui-search__form .screen-reader-text { position: absolute; clip: rect(0 0 0 0); width: 1px; height: 1px; overflow: hidden; }

/* Barra de progreso de lectura. */

.mnui-progress {
	position: fixed;
	top: 0;
	left: 0;
	height: 3px;
	width: 100%;
	z-index: 99991;
	transform: scaleX(0);
	transform-origin: 0 50%;
	background: var(--mnui-color-accent);
	pointer-events: none;
}

.admin-bar .mnui-progress { top: 32px; }

@keyframes mnui-fade {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes mnui-rise {
	from { opacity: 0; transform: translateY(-12px); }
	to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
	.mnui-header,
	.mnui-search__panel,
	.mnui-search__backdrop { animation: none !important; transition: none !important; }
}

body.mnui-search-open { overflow: hidden; }