/**
 * Header Sticky Bar — Barra fija que aparece al hacer scroll
 *
 * Usa los elementos del header: menú, logo, SUSCRÍBETE/avatar.
 * Oculto por defecto, visible con clase .is-visible (JS).
 *
 * @package InformeDigital
 */

.informe-header-sticky-bar {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 101;
	background: #fff;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	border-bottom: 1px solid #e9e9e9;
	transform: translateY(-100%);
	opacity: 0;
	visibility: hidden;
	transition: transform 0.25s ease, opacity 0.25s ease, visibility 0.25s ease;
}

.informe-header-sticky-bar.is-visible {
	transform: translateY(0);
	opacity: 1;
	visibility: visible;
}

.informe-header-sticky-bar__inner {
	display: grid;
	grid-template-columns: 2.75rem 1fr auto;
	align-items: center;
	gap: 0 12px;
	min-height: 52px;
	padding: 0.5rem 1.25rem;
	max-width: var(--header-max-width, 74.9375rem);
	margin: 0 auto;
}

.informe-header-sticky-bar__burger {
	width: 44px;
	height: 44px;
	border: 0;
	background: transparent;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	padding: 0;
	margin: 0;
}

.informe-header-sticky-bar__burger-icon {
	width: 1.5rem;
	height: 1.5rem;
	object-fit: contain;
}

.informe-header-sticky-bar__logo {
	display: inline-flex;
	align-items: center;
	justify-self: center;
}

.informe-header-sticky-bar__logo img {
	height: 1.75rem;
	max-width: 160px;
	object-fit: contain;
}

.informe-header-sticky-bar__right {
	justify-self: end;
	display: inline-flex;
	align-items: center;
	gap: .5rem;
}

.informe-header-sticky-bar__cta {
	box-sizing: border-box;
	font-family: var(--font-sans);
	font-size: .6875rem;
	line-height: 1.36;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--color-primary);
	text-decoration: none;
	padding: .25rem .5rem;
	border-radius: .125rem;
	font-weight: 700;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	white-space: nowrap;
	border: 2px solid var(--color-primary);
	background: transparent;
}

.informe-header-sticky-bar__user-icon {
	display: inline-flex;
	align-items: center;
}

.informe-header-sticky-bar__user-icon img {
	width: 20px;
	height: 20px;
	object-fit: contain;
	filter: brightness(0);
}

.informe-header-sticky-bar__user-link {
	display: inline-flex;
	border-radius: 50%;
	overflow: hidden;
	border: 0;
	background: transparent;
	padding: 0;
	cursor: pointer;
}

.informe-header-sticky-bar__avatar {
	width: 24px;
	height: 24px;
	object-fit: cover;
	display: block;
}

@media (min-width: 769px) {
	.informe-header-sticky-bar__inner {
		padding-left: var(--header-padding-tablet, 20px);
		padding-right: var(--header-padding-tablet, 20px);
	}
}

@media (min-width: 1000px) {
	.informe-header-sticky-bar__inner {
		padding-left: var(--header-padding-desktop, 1.375rem);
		padding-right: var(--header-padding-desktop, 1.375rem);
	}
}