/*--------------------------------------------------------------
  Lavena — header.css
  Mobile: [☰] [avatar] greeting/name … [🔔]
  Desktop: same identity row + horizontal nav.
--------------------------------------------------------------*/

.lavena-header {
	position: sticky;
	top: 0;
	z-index: var(--lavena-z-header);
	background: var(--lavena-surface);
	border-bottom: 1px solid var(--lavena-border);
}

.lavena-header__inner {
	width: min(100% - 2 * var(--lavena-gutter), var(--lavena-container));
	margin-inline: auto;
	min-height: var(--lavena-header-height);
	display: flex;
	align-items: center;
	gap: clamp(10px, 2.5vw, 16px);
}

/* Identity block: avatar + greeting/name */
.lavena-header__identity {
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
	flex: 1 1 auto;
}

.lavena-header__text {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.lavena-header__greeting {
	font-size: 13px;
	color: var(--lavena-muted);
	line-height: 1.3;
}

.lavena-header__name {
	font-size: 17px;
	font-weight: 600;
	color: var(--lavena-text);
	line-height: 1.3;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.lavena-header__actions {
	display: flex;
	align-items: center;
	gap: 10px;
	flex: 0 0 auto;
}

.lavena-header__login {
	display: none; /* shown on desktop */
}

/* Desktop navigation — hidden on mobile */
.lavena-desktop-nav {
	display: none;
}

@media (min-width: 1024px) {
	.lavena-header__login {
		display: inline-flex;
	}

	.lavena-header__burger {
		display: none; /* drawer is a mobile pattern; desktop shows the inline nav */
	}

	.lavena-desktop-nav {
		display: block;
		flex: 1 1 auto;
		overflow-x: auto;
	}

	.lavena-header__identity {
		flex: 0 1 auto;
	}

	.lavena-desktop-nav__list {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 4px;
		list-style: none;
		margin: 0;
		padding: 0;
	}

	.lavena-desktop-nav .lavena-drawer__link {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		padding: 10px 16px;
		border-radius: 999px;
		color: var(--lavena-muted);
		font-weight: 500;
		font-size: 14px;
		transition: background-color var(--lavena-fast) var(--lavena-ease),
			color var(--lavena-fast) var(--lavena-ease);
	}

	.lavena-desktop-nav .lavena-drawer__link:hover {
		background: var(--lavena-lavender);
		color: var(--lavena-primary);
	}

	.lavena-desktop-nav .is-active .lavena-drawer__link {
		background: var(--lavena-gradient);
		color: #fff;
	}

	.lavena-desktop-nav .lavena-drawer__icon {
		display: inline-flex;
	}
}

/* Very small phones: shrink circles slightly so everything fits. */
@media (max-width: 360px) {
	.lavena-icon-btn {
		width: 52px;
		height: 52px;
	}

	.lavena-avatar {
		width: 52px;
		height: 52px;
	}

	.lavena-header__name {
		font-size: 15px;
	}
}