/* =========================================================================
   Header Kai — barre fine, liens en pilule, fond flouté au scroll.
   Hauteur pilotée par includes/header/header.php (logo 30px + marges 18px).
   ========================================================================= */

:root {
	--kai-header-h: 66px;
	--kai-header-line: rgba(36, 47, 62, .08);
}

/* ---------- Hauteur ----------
   Salient écrit ces tailles dans css/salient-dynamic-styles.css (généré à la sauvegarde
   des options) : on les surcharge ici pour ne pas dépendre de ce fichier. */

body #header-outer #logo,
body #header-outer .logo-clone,
body #header-outer .logo-spacing {
	margin-top: 18px !important;
	margin-bottom: 18px !important;
}
body #header-outer #logo img,
body #header-outer .logo-clone img,
body #header-outer .logo-spacing img,
body #top #logo img,
#header-outer[data-permanent-transparent="false"] #logo .dark-version {
	height: 30px !important;
}
body #header-space { height: 66px !important; }

@media only screen and (max-width: 999px) {
	body #header-outer #logo,
	body #header-outer .logo-clone,
	body #header-outer .logo-spacing {
		margin-top: 0 !important;
		margin-bottom: 0 !important;
	}
	body #header-outer #logo img,
	body #header-outer .logo-clone img,
	body #top #logo img,
	#header-outer[data-permanent-transparent="false"] #logo .dark-version {
		height: 26px !important;
	}
	body #header-space { height: 50px !important; }
}

/* ---------- Barre ---------- */

body #header-outer {
	transition: background-color .35s ease, box-shadow .35s ease, -webkit-backdrop-filter .35s ease, backdrop-filter .35s ease;
}

body #header-outer.scrolling,
body #header-outer.detached.scrolling,
body #header-outer.small-nav {
	background-color: rgba(255, 255, 255, .82) !important;
	-webkit-backdrop-filter: saturate(1.6) blur(14px);
	        backdrop-filter: saturate(1.6) blur(14px);
	box-shadow: 0 1px 0 var(--kai-header-line), 0 10px 30px rgba(36, 47, 62, .06) !important;
}

/* ---------- Liens ---------- */

body #header-outer #top nav > ul.sf-menu > li > a {
	font-size: 15px !important;
	font-weight: 500 !important;
	letter-spacing: .005em;
	margin: 0 2px !important;
	padding-left: 14px !important;
	padding-right: 14px !important;
	color: #242F3E !important;
}

/* Survol : pilule douce derrière le texte (remplace le soulignement Salient) */
body #header-outer #top nav > ul.sf-menu > li > a .menu-title-text {
	position: relative;
	z-index: 0;
}
body #header-outer #top nav > ul.sf-menu > li > a .menu-title-text::before {
	content: "";
	position: absolute;
	z-index: -1;
	inset: -8px -14px;
	border-radius: 999px;
	background: rgba(36, 47, 62, .06);
	opacity: 0;
	transform: scale(.9);
	transition: opacity .25s ease, transform .35s cubic-bezier(.16, 1, .3, 1);
}
body #header-outer #top nav > ul.sf-menu > li > a:hover .menu-title-text::before,
body #header-outer #top nav > ul.sf-menu > li.sfHover > a .menu-title-text::before,
body #header-outer #top nav > ul.sf-menu > li.current-menu-item > a .menu-title-text::before,
body #header-outer #top nav > ul.sf-menu > li.current-menu-ancestor > a .menu-title-text::before {
	opacity: 1;
	transform: none;
}
body #header-outer #top nav > ul.sf-menu > li > a .menu-title-text::after { display: none !important; }

/* Flèche du sous-menu plus discrète */
body #header-outer #top nav > ul.sf-menu > li > a .sf-sub-indicator { opacity: .6; }

/* Sous-menu */
body #header-outer #top nav .sf-menu li ul {
	border-radius: 14px;
	box-shadow: 0 20px 50px rgba(36, 47, 62, .14), 0 0 0 1px var(--kai-header-line) !important;
	overflow: hidden;
}
body #header-outer .sf-menu li ul li a { font-size: 15px !important; }

/* ---------- Sélecteur de langue (globe) ---------- */

body #header-outer .dropdown span img {
	width: 38px !important;
	padding: 9px !important;
	border: 1px solid rgba(36, 47, 62, .18) !important;
	transition: border-color .25s ease, background-color .25s ease;
}
body #header-outer .dropdown:hover span img {
	border-color: #242F3E !important;
	background-color: #F2F3F5 !important;
}
body #header-outer .dropdown-content {
	border-radius: 12px;
	box-shadow: 0 20px 50px rgba(36, 47, 62, .14), 0 0 0 1px var(--kai-header-line);
}

@media (max-width: 999px) {
	:root { --kai-header-h: 50px; }
}