/**
 * CYPURGE — en-tête fixe : logo, langues, appel à l'action.
 */

body.cypurge .c-header {
	position: fixed;
	inset-inline: 0;
	top: 0;
	z-index: 40;
	border-bottom: 1px solid color-mix(in oklab, var(--c-border) 70%, transparent);
	background: color-mix(in oklab, var(--c-background) 85%, transparent);
	-webkit-backdrop-filter: blur(24px);
	backdrop-filter: blur(24px);
	box-shadow: 0 1px 0 color-mix(in oklab, var(--c-brand-ink) 5%, transparent);
}

/* La barre d'administration de WordPress, pour un éditeur connecté. */
body.cypurge.admin-bar .c-header {
	top: 32px;
}

@media (max-width: 782px) {
	body.cypurge.admin-bar .c-header {
		top: 46px;
	}
}

/* Sous 600 px la barre d'administration défile avec la page : l'en-tête
   reprend le haut de l'écran plutôt que de flotter sous un vide. */
@media (max-width: 600px) {
	body.cypurge.admin-bar .c-header {
		top: 0;
	}
}

body.cypurge .c-header__inner {
	display: flex;
	height: var(--c-header-h);
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

body.cypurge .c-header__aside {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

body.cypurge .c-header__cta {
	display: none;
}

@media (min-width: 640px) {
	body.cypurge .c-header__cta {
		display: inline-flex;
	}
}

/* ── Logo ───────────────────────────────────────────────────────── */

body.cypurge .c-brand {
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
}

body.cypurge .c-brand__logo {
	width: auto;
	height: 3rem;
	object-fit: contain;
}

body.cypurge .c-brand__mark {
	font-family: var(--c-font-interface);
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--c-brand-ink);
}

/* ── Langues ────────────────────────────────────────────────────── */

body.cypurge .c-lang {
	display: flex;
	padding: 0.25rem;
	border: 1px solid var(--c-border);
	border-radius: var(--c-radius-md);
	background: color-mix(in oklab, var(--c-card) 80%, transparent);
	font-size: 0.75rem;
	line-height: 1rem;
}

body.cypurge .c-lang__item {
	padding: 0.375rem 0.75rem;
	border-radius: var(--c-radius-sm);
	color: var(--c-muted-foreground);
	transition: color 150ms ease, background-color 150ms ease;
}

body.cypurge a.c-lang__item:hover {
	color: var(--c-foreground);
}

body.cypurge .c-lang__item.is-current {
	background: var(--c-primary);
	color: var(--c-primary-foreground);
}
