/*
 * Je Travel Navigation : apparence.
 * Tout est préfixé par body.jtnav-on : sans cette classe (mode « désactivé »), rien ne change sur le site.
 * Couleurs du thème : marine #0B2545, bleu #1CA3DD (fonds), bleu de texte #0A78A8 (contraste 4,9:1), jaune #FBB400.
 */

body.jtnav-on {
	--jtnav-navy: #0B2545;
	--jtnav-blue: #1CA3DD;
	--jtnav-ink: #0A78A8;
	--jtnav-soft: #E8F5FB;
	--jtnav-yellow: #FBB400;
	--jtnav-line: #E1E4E8;
	--jtnav-text: #1E2132;
	--jtnav-muted: #4A4F5E;
}

.jtnav-ico {
	flex: none;
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* ------------------------------------------------------------------ Bouton « Aide » (PC et mobile) */

body.jtnav-on #jeb-floating-trigger,
body.jtnav-on #jt-chat-trigger {
	/* L'onglet vertical et la bulle restent dans la page (le bouton Aide les déclenche) mais ne se voient plus. */
	position: fixed !important;
	left: -9999px !important;
	top: auto !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

.jtnav-aide {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 99990;
}

.jtnav-aide__btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	height: 52px;
	padding: 0 22px;
	border: 0;
	border-radius: 999px;
	background: var(--jtnav-navy);
	color: #fff;
	font: 600 15px/1 inherit;
	font-family: inherit;
	cursor: pointer;
	box-shadow: 0 8px 24px rgba(11, 37, 69, .3);
}

.jtnav-aide__btn[aria-expanded="true"] {
	background: var(--jtnav-ink);
}

.jtnav-aide__btn:focus-visible,
.jtnav-aide__row:focus-visible {
	outline: 3px solid var(--jtnav-yellow);
	outline-offset: 2px;
}

.jtnav-aide__pop {
	position: absolute;
	right: 0;
	bottom: 64px;
	width: 320px;
	max-width: calc(100vw - 32px);
	padding: 10px;
	border: 1px solid var(--jtnav-line);
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 20px 50px rgba(11, 37, 69, .25);
}

.jtnav-aide__pop[hidden],
.jtnav-aide__row[hidden] {
	display: none;
}

.jtnav-aide__title {
	margin: 6px 14px 8px;
	font-size: 16px;
	font-weight: 700;
	color: var(--jtnav-navy);
}

.jtnav-aide__row {
	display: flex;
	align-items: center;
	gap: 14px;
	width: 100%;
	min-height: 48px;
	padding: 0 14px;
	border: 0;
	border-radius: 10px;
	background: transparent;
	color: var(--jtnav-text);
	font: 500 15px/1.3 inherit;
	font-family: inherit;
	text-align: left;
	text-decoration: none;
	cursor: pointer;
}

.jtnav-aide__row .jtnav-ico {
	color: var(--jtnav-ink);
}

.jtnav-aide__row:hover {
	background: var(--jtnav-soft);
	color: var(--jtnav-ink);
}

.jtnav-aide__row--sep {
	margin-top: 6px;
	border-top: 1px solid var(--jtnav-line);
	border-radius: 0 0 10px 10px;
}

/* ------------------------------------------------------------------ Bandeau « En flash » : accueil seulement, fermable */

body.jtnav-on:not(.home) .jtc-ticker {
	display: none;
}

.jtnav-ticker-x {
	position: absolute;
	top: 50%;
	right: 12px;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--jtnav-text);
	cursor: pointer;
}

.jtnav-ticker-x:hover {
	background: var(--jtnav-soft);
}

/* ------------------------------------------------------------------ PC */

@media (min-width: 1025px) {

	/* Colonne d'icônes à gauche retirée (D2) : la barre du haut porte tout. */
	body.jtnav-on.bb-buddypanel .buddypanel {
		display: none !important;
	}

	body.jtnav-on.bb-buddypanel #page {
		margin-left: 0 !important;
	}

	body.jtnav-on.bb-buddypanel #masthead {
		left: 0 !important;
		width: 100% !important;
	}

	body.jtnav-on .bb-toggle-panel {
		display: none !important;
	}

	/* Le thème range une entrée dans « ••• » dès que la somme (largeur + 5 px) dépasse la largeur de #primary-navbar
	   moins 30 px de réserve, et 15 px de plus tant que « ••• » est affiché (mesuré sur le site test le 01/11/2026 :
	   à 1366 px, 4 entrées de 549 px ne passaient pas dans 568 px). La réserve est rendue : la boîte est élargie de
	   60 px sur la droite (marge négative, sous l'espace d'actions de l'en-tête), le contenu reste centré au même
	   endroit grâce au remplissage de 60 px. Quand la place manque vraiment, le thème range toujours les dernières
	   entrées dans « ••• ». */
	body.jtnav-on .site-header #primary-navbar {
		margin-right: -60px;
		padding-right: 60px;
	}

	/* Entrées de la barre du haut : alignées au centre de l'en-tête, jamais à la ligne */
	body.jtnav-on .site-header #primary-navbar #primary-menu {
		display: flex;
		align-items: stretch;
		flex-wrap: nowrap;
		gap: 4px;
		width: auto;
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu > li {
		display: flex;
		align-items: center;
		height: 76px;
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu > li > a {
		display: flex;
		align-items: center;
		gap: 6px;
		height: 44px;
		line-height: 1.2;
		padding: 0 12px;
		border-radius: 10px;
		font-weight: 500;
		color: var(--jtnav-text);
	}

	/* La petite flèche des entrées à sous-menu est un « li::after » du thème (20 px, à 5 px du bord droit de l'entrée).
	   Avec le remplissage de 12 px du lien, elle passait sous la fin du libellé (8 px de recouvrement mesuré sur le site
	   test, retour de Jacques du 01/11/2026). L'entrée perd le remplissage que le thème lui donnait et le lien réserve,
	   à droite, la place de la flèche : même largeur d'entrée qu'avant (+1 px), flèche à 5 px du texte. */
	body.jtnav-on .site-header #primary-navbar #primary-menu > li {
		padding: 0;
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu > li.menu-item-has-children > a {
		padding: 0 30px 0 10px;
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu > li > a .jtnav-ico,
	body.jtnav-on .site-header #primary-navbar #primary-menu > li > a .jtnav-desc {
		display: none;
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu > li:hover > a,
	body.jtnav-on .site-header #primary-navbar #primary-menu > li:focus-within > a,
	body.jtnav-on .site-header #primary-navbar #primary-menu > li.current-menu-item > a,
	body.jtnav-on .site-header #primary-navbar #primary-menu > li.current-menu-ancestor > a {
		background: var(--jtnav-soft);
		color: var(--jtnav-ink);
	}

	/* Boutons : un seul jaune, et « Se connecter » discret */
	body.jtnav-on .site-header #primary-navbar #primary-menu > li.jtnav-cta {
		margin-left: 12px;
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu > li.jtnav-cta > a {
		height: 46px;
		padding: 0 20px;
		background: var(--jtnav-yellow);
		color: var(--jtnav-navy);
		font-weight: 600;
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu > li.jtnav-cta > a:hover,
	body.jtnav-on .site-header #primary-navbar #primary-menu > li.jtnav-cta:hover > a {
		background: var(--jtnav-yellow);
		color: var(--jtnav-navy);
		filter: brightness(.95);
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu > li.jtnav-login > a {
		color: var(--jtnav-ink);
		font-weight: 600;
	}

	/* Bouton jaune recopié dans l'espace d'actions de l'en-tête (jtnav-cta.js) : le thème ne peut plus le ranger
	   dans « ••• ». L'élément d'origine reste dans la liste, masqué, tant que la copie est affichée. */
	body.jtnav-on.jtnav-cta-moved .jtnav-cta-slot {
		display: flex;
		align-items: center;
		margin-right: 10px;
	}

	body.jtnav-on.jtnav-cta-moved .jtnav-cta-slot .jtnav-cta-link {
		display: flex;
		align-items: center;
		height: 46px;
		padding: 0 18px;
		border-radius: 10px;
		background: var(--jtnav-yellow);
		color: var(--jtnav-navy);
		font-size: 14px;
		font-weight: 600;
		line-height: 1.2;
		white-space: nowrap;
		text-decoration: none;
	}

	body.jtnav-on.jtnav-cta-moved .jtnav-cta-slot .jtnav-cta-link:hover,
	body.jtnav-on.jtnav-cta-moved .jtnav-cta-slot .jtnav-cta-link:focus-visible {
		background: var(--jtnav-yellow);
		color: var(--jtnav-navy);
		filter: brightness(.95);
	}

	body.jtnav-on.jtnav-cta-moved .site-header #primary-navbar li.jtnav-cta {
		display: none !important;
	}

	/* Menus déroulants : au plus 6 liens, lisibles, avec icône */
	body.jtnav-on .site-header #primary-navbar #primary-menu .ab-submenu {
		min-width: 300px;
		padding: 10px;
		border: 1px solid var(--jtnav-line);
		border-radius: 16px;
		background: #fff;
		box-shadow: 0 20px 50px rgba(11, 37, 69, .22);
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu .bb-sub-menu {
		margin: 0;
		padding: 0;
		/* Le thème borne la liste à 220 px et 65 % de la hauteur : ici la liste suit le cadre. */
		max-width: none;
		max-height: none;
		overflow: visible;
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu .bb-sub-menu > li > a {
		display: flex;
		align-items: center;
		gap: 14px;
		min-height: 48px;
		padding: 0 14px;
		border-radius: 10px;
		font-size: 15px;
		font-weight: 500;
		color: var(--jtnav-text);
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu .bb-sub-menu > li > a .jtnav-ico {
		color: var(--jtnav-ink);
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu .bb-sub-menu > li > a:hover,
	body.jtnav-on .site-header #primary-navbar #primary-menu .bb-sub-menu > li.current-menu-item > a {
		background: var(--jtnav-soft);
		color: var(--jtnav-ink);
	}

	/* Dernier lien d'un déroulant (« Mes projets ») : séparé, en bleu */
	body.jtnav-on .site-header #primary-navbar #primary-menu .bb-sub-menu > li.jtnav-more {
		margin-top: 6px;
		padding-top: 6px;
		border-top: 1px solid var(--jtnav-line);
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu .bb-sub-menu > li.jtnav-more > a {
		font-size: 14px;
		font-weight: 600;
		color: var(--jtnav-ink);
	}

	/* Méga-menu visiteur « Je veux… » : 4 cartes, puis les raccourcis par pays.
	   Les règles des cartes et des pays portent « .bb-sub-menu > li.jtnav-card > a » : sans cela, la règle générale
	   des liens des déroulants (« .bb-sub-menu > li > a », plus précise de un sélecteur d'élément) les écrasait, et la
	   carte se mettait en ligne (icône, titre, texte côte à côte, texte qui sort de la carte). Constaté par Jacques
	   dans une fenêtre privée sur le site test, le 01/11/2026. */
	/* Le cadre est centré dans l'en-tête (et non sous le lien) : il ne déborde jamais de l'écran. */
	body.jtnav-on .site-header #primary-navbar #primary-menu > li.jtnav-mega {
		position: static;
		--jtnav-mega-w: min(1020px, calc(100vw - 80px));
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu > li.jtnav-mega > .ab-submenu {
		left: 50%;
		width: var(--jtnav-mega-w);
		margin-left: calc(var(--jtnav-mega-w) / -2);
		padding: 26px 32px 22px;
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu > li.jtnav-mega .bb-sub-menu {
		display: grid;
		grid-template-columns: repeat(20, minmax(0, 1fr));
		gap: 12px 16px;
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu > li.jtnav-mega .bb-sub-menu::before {
		content: "Je veux…";
		grid-column: 1 / -1;
		order: 0;
		font-size: 13px;
		font-weight: 600;
		letter-spacing: .08em;
		text-transform: uppercase;
		color: var(--jtnav-ink);
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu > li.jtnav-mega .bb-sub-menu::after {
		content: "Les plus consultés";
		grid-column: 1 / -1;
		order: 2;
		margin-top: 8px;
		padding-top: 16px;
		border-top: 1px solid var(--jtnav-line);
		font-size: 14px;
		font-weight: 600;
		color: var(--jtnav-text);
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu > li.jtnav-mega .bb-sub-menu > li.jtnav-card {
		grid-column: span 5;
		order: 1;
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu > li.jtnav-mega .bb-sub-menu > li.jtnav-chip {
		grid-column: span 4;
		order: 3;
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu .bb-sub-menu > li.jtnav-card > a {
		display: block;
		height: 100%;
		padding: 20px;
		border: 1px solid var(--jtnav-line);
		border-radius: 16px;
		background: #fff;
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu .bb-sub-menu > li.jtnav-card > a:hover {
		border-color: var(--jtnav-ink);
		background: var(--jtnav-soft);
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu .bb-sub-menu > li.jtnav-card > a .jtnav-ico {
		box-sizing: content-box;
		width: 22px;
		height: 22px;
		padding: 12px;
		margin-bottom: 14px;
		border-radius: 50%;
		background: var(--jtnav-soft);
		color: var(--jtnav-ink);
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu .bb-sub-menu > li.jtnav-card > a > span:not(.jtnav-desc) {
		display: block;
		font-size: 17px;
		font-weight: 600;
		color: var(--jtnav-navy);
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu .bb-sub-menu > li.jtnav-card > a,
	body.jtnav-on .site-header #primary-navbar #primary-menu .bb-sub-menu > li.jtnav-card > a > span {
		white-space: normal;
		overflow: visible;
		text-overflow: clip;
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu .bb-sub-menu > li.jtnav-chip > a > span {
		margin: 0 auto;
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu .bb-sub-menu > li.jtnav-card > a .jtnav-desc {
		display: block;
		margin-top: 4px;
		font-size: 14px;
		font-weight: 400;
		line-height: 1.45;
		color: var(--jtnav-muted);
	}

	body.jtnav-on .site-header #primary-navbar #primary-menu .bb-sub-menu > li.jtnav-chip > a {
		justify-content: center;
		min-height: 38px;
		padding: 0 16px;
		border: 1px solid #D6D9DD;
		border-radius: 999px;
		font-size: 14px;
	}
}

/* ------------------------------------------------------------------ Mobile et tablette : barre d'onglets du bas (membre) */

.jtnav-tabbar,
.jtnav-sheet,
.jtnav-ctabar,
.jtnav-cta-slot {
	display: none;
}

html.jtnav-lock {
	overflow: hidden;
}

/* Jusqu'à 1199 px (et non 1024) : au-dessous de 1200 px, l'en-tête du thème (logo, quatre entrées, bouton jaune,
   recherche, messages, notifications, panier, nom et avatar) ne tient plus et l'avatar sort de l'écran
   (mesuré sur le site test à 1100 px : le bord droit de l'en-tête était à 1164 px). Les iPad en paysage
   (1180 et 1194 px) reçoivent donc la barre du bas, comme les téléphones. Les visiteurs n'ont pas de barre :
   leur en-tête est plus léger et reste en haut dès 1025 px. */
@media (max-width: 1199px) {

	/* Les entrées passent dans la barre du bas : plus de menu horizontal ni de colonne en doublon. */
	body.jtnav-member #primary-navbar {
		display: none !important;
	}

	body.jtnav-member.bb-buddypanel .buddypanel {
		display: none !important;
	}

	body.jtnav-member.bb-buddypanel #page {
		margin-left: 0 !important;
	}

	body.jtnav-member.bb-buddypanel #masthead {
		left: 0 !important;
		width: 100% !important;
	}

	body.jtnav-member .bb-toggle-panel,
	body.jtnav-member .bb-left-panel-icon-wrap {
		display: none !important;
	}

	body.jtnav-member {
		padding-bottom: calc(68px + env(safe-area-inset-bottom, 0px));
	}

	/* L'aide est dans « Plus » : pas de bouton flottant par-dessus la barre. */
	body.jtnav-member .jtnav-aide {
		display: none;
	}

	body.jtnav-member .jtnav-tabbar {
		position: fixed;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 99980;
		display: grid;
		grid-template-columns: 1fr 1fr 1.4fr 1fr .8fr; /* « Communauté » est le libellé le plus long : il reçoit plus de place */
		height: calc(68px + env(safe-area-inset-bottom, 0px));
		padding-bottom: env(safe-area-inset-bottom, 0px);
		border-top: 1px solid var(--jtnav-line);
		background: #fff;
	}

	.jtnav-tab {
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 3px;
		min-height: 44px;
		padding: 0;
		border: 0;
		background: transparent;
		color: var(--jtnav-muted);
		font-family: inherit;
		font-size: 12px;
		font-weight: 500;
		line-height: 1.1;
		white-space: nowrap;
		text-decoration: none;
		cursor: pointer;
	}

	.jtnav-tab .jtnav-ico {
		width: 24px;
		height: 24px;
	}

	/* Le thème peint tout <button> en bleu au survol, au focus et à l'appui (fond et texte de la même couleur :
	   le libellé de « Plus » disparaissait, mesuré sur le site test). On reprend la main sur ces états. */
	body.jtnav-member .jtnav-tabbar .jtnav-tab,
	body.jtnav-member .jtnav-tabbar .jtnav-tab:hover,
	body.jtnav-member .jtnav-tabbar .jtnav-tab:focus,
	body.jtnav-member .jtnav-tabbar .jtnav-tab:active {
		border: 0;
		background: transparent;
		box-shadow: none;
		color: var(--jtnav-muted);
	}

	body.jtnav-member .jtnav-tabbar .jtnav-tab.is-active,
	body.jtnav-member .jtnav-tabbar .jtnav-tab[aria-expanded="true"] {
		background: transparent;
		color: var(--jtnav-ink);
		font-weight: 600;
	}

	.jtnav-tab.is-active,
	.jtnav-tab[aria-expanded="true"] {
		color: var(--jtnav-ink);
		font-weight: 600;
	}

	.jtnav-tab.is-active::before,
	.jtnav-tab[aria-expanded="true"]::before {
		content: "";
		position: absolute;
		top: 0;
		right: 22%;
		left: 22%;
		height: 3px;
		border-radius: 0 0 3px 3px;
		background: var(--jtnav-blue);
	}

	.jtnav-tab:focus-visible,
	.jtnav-more__x:focus-visible,
	.jtnav-more__acts > *:focus-visible,
	.jtnav-more__list a:focus-visible {
		outline: 3px solid var(--jtnav-yellow);
		outline-offset: -3px;
	}

	/* Feuille « Plus » : au-dessus de la barre, qui reste visible */
	body.jtnav-member .jtnav-sheet {
		position: fixed;
		top: 0;
		right: 0;
		bottom: calc(68px + env(safe-area-inset-bottom, 0px));
		left: 0;
		z-index: 99981;
		display: block;
	}

	.jtnav-sheet[hidden] {
		display: none !important;
	}

	.jtnav-more__scrim {
		position: absolute;
		inset: 0;
		background: rgba(11, 37, 69, .5);
	}

	.jtnav-more__sheet {
		position: absolute;
		right: 0;
		bottom: 0;
		left: 0;
		max-height: 88%;
		padding: 10px 16px 8px;
		overflow-y: auto;
		border-radius: 24px 24px 0 0;
		background: #fff;
		color: var(--jtnav-text);
	}

	.jtnav-more__handle {
		width: 44px;
		height: 5px;
		margin: 0 auto 12px;
		border-radius: 3px;
		background: #C8CCD3;
	}

	.jtnav-more__head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 40px;
		margin-bottom: 8px;
		font-size: 20px;
		color: var(--jtnav-navy);
	}

	.jtnav-more__x {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		margin-right: -8px;
		padding: 0;
		border: 0;
		background: transparent;
		color: var(--jtnav-navy);
		cursor: pointer;
	}

	.jtnav-more__aide {
		margin-bottom: 16px;
		padding: 16px;
		border-radius: 18px;
		background: var(--jtnav-soft);
	}

	.jtnav-more__aide p {
		margin: 0 0 12px;
		font-size: 16px;
		font-weight: 600;
		color: var(--jtnav-navy);
	}

	.jtnav-more__acts {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 10px;
	}

	.jtnav-more__acts > * {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 6px;
		min-height: 76px;
		padding: 0 4px;
		border: 0;
		border-radius: 14px;
		background: #fff;
		color: var(--jtnav-navy);
		font-family: inherit;
		font-size: 13px;
		font-weight: 600;
		text-align: center;
		text-decoration: none;
		cursor: pointer;
	}

	.jtnav-more__acts > [hidden] {
		display: none;
	}

	.jtnav-more__acts .jtnav-ico {
		color: var(--jtnav-ink);
	}

	.jtnav-more__label {
		margin: 0 0 4px;
		font-size: 13px;
		font-weight: 600;
		letter-spacing: .08em;
		text-transform: uppercase;
		color: var(--jtnav-ink);
	}

	.jtnav-more__list {
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.jtnav-more__list li {
		margin: 0;
		border-bottom: 1px solid var(--jtnav-line);
	}

	.jtnav-more__list li:last-child {
		border-bottom: 0;
	}

	.jtnav-more__list a {
		display: flex;
		align-items: center;
		gap: 14px;
		min-height: 52px;
		font-size: 16px;
		font-weight: 500;
		color: var(--jtnav-text);
		text-decoration: none;
	}

	.jtnav-more__list .jtnav-ico {
		color: var(--jtnav-ink);
	}

	/* Feuille d'une rubrique (Communauté, Mon projet…) : la page où l'on se trouve est marquée. */
	.jtnav-more__list a.is-active {
		font-weight: 600;
		color: var(--jtnav-ink);
	}

	.jtnav-more__list a.is-active::after {
		content: "";
		width: 8px;
		height: 8px;
		margin-left: auto;
		border-radius: 50%;
		background: var(--jtnav-blue);
	}

	.jtnav-more__list li.jtnav-out a,
	.jtnav-more__list li.jtnav-out .jtnav-ico {
		color: #8A1C1C;
	}
}

/* ------------------------------------------------------------------ Mobile : visiteur */

@media (max-width: 799px) {

	body.jtnav-visitor .jtnav-ctabar {
		position: fixed;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 99980;
		display: block;
		padding: 12px 16px calc(16px + env(safe-area-inset-bottom, 0px));
		border-top: 1px solid var(--jtnav-line);
		background: #fff;
		box-shadow: 0 -6px 18px rgba(11, 37, 69, .08);
	}

	body.jtnav-visitor .jtnav-ctabar__btn {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 52px;
		border-radius: 14px;
		background: var(--jtnav-yellow);
		color: var(--jtnav-navy);
		font-size: 16px;
		font-weight: 700;
		text-decoration: none;
	}

	body.jtnav-has-cta {
		padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px));
	}

	/* Le bouton Aide du visiteur monte au-dessus de la barre jaune. */
	body.jtnav-has-cta .jtnav-aide {
		bottom: calc(96px + env(safe-area-inset-bottom, 0px));
	}
}

/* ------------------------------------------------------------------ Mobile : panneau du visiteur (le burger du thème) */

@media (max-width: 799px) {

	/* « Je veux… » : quatre tuiles 2 × 2 quand « Mon projet » est ouvert ; les raccourcis par pays restent pour le PC. */
	body.jtnav-visitor .bb-mobile-panel-wrapper li.jtnav-mega > ul.sub-menu.bb-open {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px;
		padding: 12px 16px;
	}

	body.jtnav-visitor .bb-mobile-panel-wrapper li.jtnav-mega > ul.sub-menu > li.jtnav-chip {
		display: none;
	}

	body.jtnav-visitor .bb-mobile-panel-wrapper li.jtnav-card {
		height: auto;
		line-height: 1.3;
	}

	body.jtnav-visitor .bb-mobile-panel-wrapper li.jtnav-card > a {
		position: relative; /* le thème place les liens du panneau en absolu : sans cela les tuiles se chevauchent */
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: space-between;
		gap: 8px;
		min-height: 100px;
		padding: 14px;
		border: 1px solid var(--jtnav-line);
		border-radius: 16px;
		background: #FAFBFD;
		font-size: 15px;
		font-weight: 600;
		color: var(--jtnav-navy);
	}

	body.jtnav-visitor .bb-mobile-panel-wrapper li.jtnav-card > a > span:not(.jtnav-desc) {
		white-space: normal;
		overflow: visible;
		text-overflow: clip;
	}

	body.jtnav-visitor .bb-mobile-panel-wrapper li.jtnav-card > a .jtnav-ico {
		box-sizing: content-box;
		width: 20px;
		height: 20px;
		padding: 10px;
		border-radius: 50%;
		background: var(--jtnav-soft);
		color: var(--jtnav-ink);
	}

	body.jtnav-visitor .bb-mobile-panel-wrapper li.jtnav-card .jtnav-desc {
		display: none;
	}

	body.jtnav-visitor .bb-mobile-panel-wrapper li.jtnav-login > a {
		color: var(--jtnav-ink);
		font-weight: 600;
	}

	/* Le bouton jaune du panneau n'apparaît que si la barre du bas ne le porte pas déjà. */
	body.jtnav-visitor .bb-mobile-panel-wrapper li.jtnav-cta > a {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 52px;
		margin: 8px 16px;
		border-radius: 14px;
		background: var(--jtnav-yellow);
		color: var(--jtnav-navy);
		font-weight: 700;
	}

	body.jtnav-has-cta .bb-mobile-panel-wrapper li.jtnav-cta {
		display: none;
	}
}

/* ------------------------------------------------------------------ « Mon espace » : un en-tête compact, le parcours en premier */

/*
 * La page /membres/…/mobilite/ empilait quatre couches : barre du haut, 12 onglets du profil, couverture et statistiques,
 * puis les onglets du parcours. Ici : on garde la barre du haut et les onglets du parcours ; le profil se replie
 * (avatar, nom, statut). Couverture, statistiques, réseaux sociaux et onglets du profil restent sur « Mon profil ».
 * Le corps de page porte la classe « mobilite » (BuddyBoss) sur cette seule page.
 */
body.jtnav-on.mobilite #object-nav {
	display: none !important;
}

body.jtnav-on.mobilite .jtc-header__cover,
body.jtnav-on.mobilite .jtc-header__stats,
body.jtnav-on.mobilite .jtc-header__social,
body.jtnav-on.mobilite .jtc-header__meta,
body.jtnav-on.mobilite .link-change-profile-image,
body.jtnav-on.mobilite .link-change-cover-image,
body.jtnav-on.mobilite .link-change-overlay {
	display: none !important;
}

body.jtnav-on.mobilite #cover-image-container {
	margin-bottom: 12px !important;
}

body.jtnav-on.mobilite .jtc-header__body {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center;
	gap: 16px !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 16px !important;
}

body.jtnav-on.mobilite .jtc-header__avatar {
	position: relative !important;
	top: auto !important;
	left: auto !important;
	flex: none;
	width: 64px !important;
	height: 64px !important;
	margin: 0 !important;
}

body.jtnav-on.mobilite .jtc-header__avatar .jetravel-avatar-wrapper,
body.jtnav-on.mobilite .jtc-header__avatar img {
	width: 64px !important;
	height: 64px !important;
}

body.jtnav-on.mobilite .jtc-header__content {
	flex: 1 1 0 !important;
	width: auto !important;
	min-width: 0 !important;
}

body.jtnav-on.mobilite .jtc-header__content,
body.jtnav-on.mobilite .jtc-header__main,
body.jtnav-on.mobilite .jtc-header__identity {
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}

body.jtnav-on.mobilite .jtc-header__identity {
	gap: 6px !important;
}


/* ==================================================================================================
   0.6.0 (chantier « Mon espace », lot 2) : rubrique active du menu du haut, feuilles en deux groupes, pastille
   « Plus », profil compact sur mobile.
   ================================================================================================== */

.jtnav-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* PC : l'entrée de la page affichée est marquée dans le menu du haut (fond clair, trait bleu foncé dessous). */
@media (min-width: 1025px) {
	body.jtnav-on .site-header #primary-navbar #primary-menu > li.jtnav-current > a {
		background: var(--jtnav-soft);
		color: var(--jtnav-ink);
		box-shadow: inset 0 -3px 0 var(--jtnav-ink);
	}
}

/* Mobile : pastille rouge sur « Plus » et compteur sur la ligne du compte (contrats à signer). */
.jtnav-tab--more .jtnav-dot {
	position: absolute;
	top: 4px;
	left: calc(50% + 6px);
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #B3202C;
	border: 2px solid #fff;
}

.jtnav-more__list .jtnav-count {
	margin-left: auto;
	min-width: 22px;
	height: 22px;
	padding: 0 6px;
	border-radius: 11px;
	background: #B3202C;
	color: #fff;
	font-size: 12px;
	font-style: normal;
	font-weight: 700;
	line-height: 22px;
	text-align: center;
}

/* Feuilles à deux groupes : de l'air avant le deuxième titre. */
.jtnav-more__sheet .jtnav-more__list + .jtnav-more__label {
	margin-top: 16px;
}

/* « Mon espace » sur mobile : profil compact (avatar de 48 px) pour que la suite arrive plus haut. */
@media (max-width: 700px) {
	body.jtnav-on.mobilite .jtc-header__body {
		padding: 12px 14px !important;
		gap: 12px !important;
	}

	body.jtnav-on.mobilite .jtc-header__avatar,
	body.jtnav-on.mobilite .jtc-header__avatar .jetravel-avatar-wrapper,
	body.jtnav-on.mobilite .jtc-header__avatar img {
		width: 48px !important;
		height: 48px !important;
	}

	body.jtnav-on.mobilite .jtc-header .user-nicename {
		font-size: 19px !important;
	}
}
