/*
 * IPBF : graphiques statistiques (module « Graphiques »), charte 2026, révision sobre.
 * Palette des séries validée (bande de luminance, chroma, daltonismes, contraste) :
 * prune #7E2678, orange #FF4D00, violet #A33098, or #F29100, gris violacé #5B4F66 ; « Autres / Non » #C9BFCD.
 * Marques fines, extrémité de donnée arrondie à 4 px, 2 px de blanc entre segments, textes en encre (jamais
 * dans la couleur de la série), valeur au bout des barres, tableau des données sous chaque graphique.
 */
.ipbf-g {
	--g1: #7E2678;
	--g2: #FF4D00;
	--g3: #A33098;
	--g4: #F29100;
	--g5: #5B4F66;
	--gn: #C9BFCD;
	--ge: #5B4F66;
	--g-texte: #2A1F2D;
	--g-texte-2: #5B4F66;
	--g-ligne: #E3DCE4;
	--g-axe: #CFC5D2;
	--g-papier: #FAF5EF;
	--g-reserve: 4.6em;
	--g-cat: minmax(6.5rem, 34%);
	container-type: inline-size;
	container-name: ipbfg;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 18px;
	width: 100%;
	min-width: 0;
	height: 100%;
	margin: 0;
	font-family: Lato, system-ui, sans-serif;
	font-size: 15px;
	line-height: 1.45;
	color: var(--g-texte);
	text-align: left;
}
.ipbf-g *,
.ipbf-g *::before,
.ipbf-g *::after { box-sizing: border-box; }
.ipbf-g p,
.ipbf-g ul,
.ipbf-g ol,
.ipbf-g li,
.ipbf-g figcaption { margin: 0; }
.ipbf-g.is-cadre {
	padding: 28px;
	background: #FFFFFF;
	border: 1px solid rgba(27, 18, 38, 0.13);
	border-radius: 16px;
}
@media (max-width: 767px) {
	.ipbf-g.is-cadre { padding: 22px 18px; }
}

/* En-tête (neutralise le style de légende d'image du thème : italique, centré, petit) */
.ipbf-g figcaption.ipbf-g__tete { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; font-size: inherit; font-style: normal; line-height: inherit; color: inherit; text-align: left; }
.ipbf-g .ipbf-g__titre {
	margin: 0;
	padding: 0;
	font-family: Outfit, Lato, system-ui, sans-serif;
	font-weight: 600;
	font-size: 19px;
	line-height: 1.3;
	letter-spacing: 0;
	text-transform: none;
	color: var(--g-texte);
}
.ipbf-g__soustitre { display: block; font-size: 14px; line-height: 1.45; color: var(--g-texte-2); }

/* Légende */
.ipbf-g .ipbf-g__legende {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
	padding: 0;
	list-style: none;
	font-size: 14px;
	line-height: 1.35;
}
.ipbf-g .ipbf-g__legende li { display: inline-flex; align-items: center; gap: 8px; padding: 0; }
.ipbf-g__pastille {
	display: inline-block;
	flex: none;
	width: 12px;
	height: 12px;
	border-radius: 3px;
	background: var(--c);
}

/* ----- Barres horizontales et barres empilées ----- */
.ipbf-g__barres { display: flex; flex-direction: column; gap: 10px; }
.ipbf-g__barres.is-multi { gap: 14px; }
.ipbf-g__ligne {
	display: grid;
	grid-template-columns: var(--g-cat) minmax(0, 1fr);
	column-gap: 14px;
	align-items: center;
	border-radius: 6px;
	transition: background-color 0.15s, box-shadow 0.15s;
}
.ipbf-g__ligne:hover { background-color: var(--g-papier); box-shadow: 0 0 0 5px var(--g-papier); }
.ipbf-g__cat { font-size: 14.5px; line-height: 1.3; color: var(--g-texte); overflow-wrap: break-word; hyphens: auto; }
.ipbf-g__ligne.is-total { padding-top: 12px; border-top: 1px solid var(--g-ligne); border-radius: 0; }
.ipbf-g__ligne.is-total:hover { box-shadow: none; }
.ipbf-g__ligne.is-total .ipbf-g__cat { font-weight: 700; }
.ipbf-g__pistes {
	display: flex;
	flex-direction: column;
	gap: 3px;
	padding: 2px 0;
	border-left: 1px solid var(--g-axe);
}
.ipbf-g__piste { display: flex; align-items: center; gap: 8px; min-height: 18px; }
.ipbf-g__barre {
	display: block;
	flex: none;
	width: calc((100% - var(--g-reserve)) * var(--p));
	height: 18px;
	background: var(--c);
	border-radius: 0 4px 4px 0;
}
.is-multi .ipbf-g__piste { min-height: 14px; }
.is-multi .ipbf-g__barre { height: max(9px, calc(28px / var(--n))); }
.ipbf-g__val {
	flex: none;
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1.1;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
	color: var(--g-texte);
}
.is-multi .ipbf-g__val { font-size: 13px; }

/* Axe sous les barres */
.ipbf-g__axe {
	display: grid;
	grid-template-columns: var(--g-cat) minmax(0, 1fr);
	column-gap: 14px;
	margin-top: 2px;
}
.ipbf-g__graduations { position: relative; display: block; height: 18px; font-size: 13px; line-height: 18px; color: var(--g-texte-2); font-variant-numeric: tabular-nums; }
.ipbf-g__graduations span { position: absolute; top: 0; left: calc((100% - var(--g-reserve)) * var(--t)); white-space: nowrap; transform: translateX(-50%); }
.ipbf-g__graduations span:first-child { transform: none; }
.ipbf-g__graduations span:nth-child(2),
.ipbf-g__graduations span:nth-child(4) { display: none; }

/* Barres empilées */
.ipbf-g__pile { display: flex; gap: 2px; height: 26px; min-width: 0; }
.ipbf-g__seg {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 1;
	flex-basis: 0;
	min-width: 2px;
	background: var(--c);
	cursor: default;
}
.ipbf-g__seg:first-child { border-radius: 4px 0 0 4px; }
.ipbf-g__seg:last-child { border-radius: 0 4px 4px 0; }
.ipbf-g__seg:only-child { border-radius: 4px; }
.ipbf-g__seg:hover { filter: brightness(1.12) saturate(1.05); }
.ipbf-g__segval { font-size: 13px; font-weight: 700; line-height: 1; color: var(--t); white-space: nowrap; font-variant-numeric: tabular-nums; }
.ipbf-g__seg.is-s .ipbf-g__segval { display: none; }
.is-pile .ipbf-g__ligne { gap: 14px; }

/* Étiquettes au-dessus des barres dans un cadre étroit */
@container ipbfg (max-width: 560px) {
	.ipbf-g__seg.is-m .ipbf-g__segval { display: none; }
}
@container ipbfg (max-width: 460px) {
	.ipbf-g__ligne,
	.ipbf-g__axe { grid-template-columns: minmax(0, 1fr); row-gap: 6px; }
	.ipbf-g__axe > span:first-child { display: none; }
	.ipbf-g__ligne:hover { box-shadow: 0 0 0 4px var(--g-papier); }
	.ipbf-g__graduations span:nth-child(2),
	.ipbf-g__graduations span:nth-child(4) { display: none; }
}
@container ipbfg (min-width: 620px) {
	.ipbf-g__graduations span:nth-child(2),
	.ipbf-g__graduations span:nth-child(4) { display: inline; }
}

/* ----- Colonnes ----- */
.ipbf-g__colonnes { position: relative; padding-left: 2.8em; padding-top: 20px; }
.ipbf-g__colonnes .ipbf-g__grille,
.ipbf-g__courbe .ipbf-g__grille { position: absolute; left: 2.8em; right: 0; top: 20px; height: 220px; pointer-events: none; }
.ipbf-g__grille span { position: absolute; left: 0; right: 0; bottom: calc(var(--t) * 100%); height: 0; border-top: 1px solid var(--g-ligne); }
.ipbf-g__grille span:first-child { border-top-color: var(--g-axe); }
.ipbf-g__grille i { position: absolute; right: 100%; top: 0; margin-right: 8px; font-style: normal; font-size: 13px; line-height: 1; color: var(--g-texte-2); white-space: nowrap; transform: translateY(-50%); font-variant-numeric: tabular-nums; }
.ipbf-g__groupes { position: relative; display: grid; grid-template-columns: repeat(var(--k), minmax(0, 1fr)); gap: 6px; }
.ipbf-g__groupe { display: flex; flex-direction: column; align-items: center; min-width: 0; }
.ipbf-g__cols { display: flex; align-items: flex-end; justify-content: center; gap: 3px; width: 100%; height: 220px; }
.ipbf-g__col { position: relative; width: min(24px, calc((100% - 6px) / var(--n))); height: calc(var(--p) * 100%); background: var(--c); border-radius: 4px 4px 0 0; }
.ipbf-g__col:hover { filter: brightness(1.12); }
.ipbf-g__col .ipbf-g__val { position: absolute; bottom: 100%; left: 50%; margin-bottom: 4px; font-size: 13px; transform: translateX(-50%); }
.ipbf-g__groupe .ipbf-g__cat { margin-top: 10px; font-size: 13.5px; text-align: center; }
.ipbf-g__groupe.is-total .ipbf-g__cat { font-weight: 700; }

/* ----- Courbe ----- */
.ipbf-g__courbe { position: relative; padding: 20px 2.4em 0 2.8em; }
.ipbf-g__courbe .ipbf-g__grille { right: 2.4em; }
.ipbf-g__zone { position: relative; height: 220px; }
.ipbf-g__zone svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.ipbf-g__point { position: absolute; width: 10px; height: 10px; margin: 0 0 -5px -5px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 2px #FFFFFF; }
.ipbf-g__point::after { content: ""; position: absolute; inset: -8px; border-radius: 50%; }
.ipbf-g__fin { position: absolute; margin: 0 0 -0.6em 10px; font-size: 13px; font-weight: 700; line-height: 1.2; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ipbf-g__abscisses { position: relative; height: 2.6em; margin-top: 8px; font-size: 13.5px; }
.ipbf-g__abscisses span { position: absolute; top: 0; max-width: 9em; text-align: center; transform: translateX(-50%); line-height: 1.25; }
.ipbf-g__abscisses span:first-child { text-align: left; transform: none; }
.ipbf-g__abscisses span:last-child { text-align: right; transform: translateX(-100%); }

/* ----- Anneau ----- */
.ipbf-g__donut { display: flex; flex-wrap: wrap; align-items: center; gap: 22px 28px; }
.ipbf-g__donut svg { display: block; flex: none; width: 172px; height: 172px; transform: rotate(-90deg); }
.ipbf-g__part { transition: opacity 0.15s; }
.ipbf-g__part:hover { opacity: 0.82; }
.ipbf-g .ipbf-g__donut ol { display: flex; flex: 1 1 220px; flex-direction: column; gap: 9px; padding: 0; list-style: none; }
.ipbf-g .ipbf-g__donut li { display: grid; grid-template-columns: 12px minmax(0, 1fr) auto; align-items: baseline; gap: 10px; padding: 0; font-size: 14.5px; line-height: 1.35; }
.ipbf-g__donut li .ipbf-g__pastille { transform: translateY(1px); }
.ipbf-g__donut li b { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
@container ipbfg (max-width: 420px) {
	.ipbf-g__colonnes { padding-left: 2.4em; }
	.ipbf-g__colonnes .ipbf-g__grille { left: 2.4em; }
	.ipbf-g__groupes { gap: 2px; }
	.ipbf-g__cols { gap: 5px; }
	.ipbf-g__donut { justify-content: center; }
	.ipbf-g__donut svg { width: 150px; height: 150px; }
}

/* ----- Jauges ----- */
.ipbf-g__jauges { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 22px 10px; }
.ipbf-g__jauge { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.ipbf-g__cadran { position: relative; display: block; width: min(112px, 100%); aspect-ratio: 1; }
.ipbf-g__cadran svg { display: block; width: 100%; height: 100%; transform: rotate(-90deg); }
.ipbf-g__jval { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 700; line-height: 1; color: var(--g-texte); white-space: nowrap; }
.ipbf-g__jauge .ipbf-g__cat { max-width: 14ch; font-size: 14.5px; }
.ipbf-g__jauge.is-total .ipbf-g__cat { font-weight: 700; }

/* ----- À retenir, source, données ----- */
.ipbf-g__note {
	padding: 12px 16px;
	font-size: 15px;
	line-height: 1.5;
	color: var(--g-texte);
	background: var(--g-papier);
	border-left: 3px solid #FF4D00;
	border-radius: 0 10px 10px 0;
}
.ipbf-g:not(.is-cadre) .ipbf-g__note { background: #FFFFFF; }
.ipbf-g__note strong { font-weight: 700; }
.ipbf-g__pied {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: 8px 18px;
	margin-top: auto;
	padding-top: 14px;
	border-top: 1px solid var(--g-ligne);
}
.ipbf-g__source { flex: 1 1 200px; font-size: 13px; line-height: 1.45; color: var(--g-texte-2); }
.ipbf-g__donnees { flex: 0 0 auto; }
.ipbf-g__donnees[open] { flex-basis: 100%; }
.ipbf-g__donnees summary {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 24px;
	font-size: 14px;
	font-weight: 700;
	color: #6F1C6A;
	list-style: none;
	cursor: pointer;
}
.ipbf-g__donnees summary::-webkit-details-marker { display: none; }
.ipbf-g__donnees summary::after {
	content: "";
	width: 7px;
	height: 7px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-2px) rotate(45deg);
	transition: transform 0.15s;
}
.ipbf-g__donnees[open] summary::after { transform: translateY(2px) rotate(-135deg); }
.ipbf-g__donnees summary:hover { text-decoration: underline; text-underline-offset: 3px; }
.ipbf-g__donnees summary:focus-visible,
.ipbf-g__table-wrap:focus-visible { outline: 2px solid #6F1C6A; outline-offset: 3px; border-radius: 4px; }

/* Tableaux */
.ipbf-g__table-wrap { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.ipbf-g__donnees .ipbf-g__table-wrap { margin-top: 12px; }
.ipbf-g table.ipbf-g__table { width: 100%; margin: 0; border: 0; border-collapse: collapse; font-size: 14px; line-height: 1.35; }
.ipbf-g .ipbf-g__table th,
.ipbf-g .ipbf-g__table td {
	padding: 9px 10px;
	text-align: right;
	vertical-align: top;
	font-variant-numeric: tabular-nums;
	border: 0;
	border-bottom: 1px solid var(--g-ligne);
	background-color: transparent;
	color: var(--g-texte);
}
.ipbf-g .ipbf-g__table thead th { font-size: 13.5px; font-weight: 700; vertical-align: bottom; border-bottom-color: var(--g-axe); }
.ipbf-g .ipbf-g__table th:first-child { text-align: left; }
.ipbf-g .ipbf-g__table tbody th { font-weight: 400; }
.ipbf-g .ipbf-g__table tr.is-total th,
.ipbf-g .ipbf-g__table tr.is-total td { font-weight: 700; }
.ipbf-g .ipbf-g__table tbody > tr:hover > th,
.ipbf-g .ipbf-g__table tbody > tr:hover > td { background-color: transparent; }
.ipbf-g .ipbf-g__table .is-total-col { font-weight: 700; border-left: 1px solid var(--g-axe); }
.ipbf-g .ipbf-g__table.is-heat tbody > tr > td:not(.is-total-col) { background-color: rgb(126 38 120 / var(--a, 0)); border-left: 2px solid #FFFFFF; }
.ipbf-g__defiler { display: none; font-size: 13px; color: var(--g-texte-2); }
@container ipbfg (max-width: 700px) {
	.ipbf-g__defiler { display: block; }
}
.ipbf-g .ipbf-g__table.is-heat tbody > tr:hover > th { text-decoration: underline; text-underline-offset: 3px; }
.ipbf-g--tableau .ipbf-g__table { min-width: 640px; }
.ipbf-g--tableau .ipbf-g__table thead th:not(:first-child) { min-width: 5.6em; }
.ipbf-g--tableau .ipbf-g__table th:first-child { position: sticky; left: 0; z-index: 1; min-width: 13rem; background-color: #FFFFFF; }
.ipbf-g--tableau .ipbf-g__table td { font-size: 14.5px; }

/* Bulle d'information (survol ou toucher d'un segment, d'une colonne, d'une part) */
.ipbf-g-bulle {
	position: fixed;
	z-index: 99999;
	display: none;
	max-width: 260px;
	padding: 7px 10px;
	font-family: Lato, system-ui, sans-serif;
	font-size: 13px;
	line-height: 1.35;
	color: #FFFFFF;
	background: #1B1226;
	border-radius: 6px;
	pointer-events: none;
}
.ipbf-g-bulle strong { display: block; font-size: 15px; font-weight: 700; }
.ipbf-g-vide { padding: 16px; font: 15px/1.5 Lato, system-ui, sans-serif; color: #5B4F66; border: 1px dashed #CFC5D2; border-radius: 10px; }

/* Impression : données dépliées */
@media print {
	.ipbf-g { break-inside: avoid; }
	.ipbf-g__donnees summary { display: none; }
	.ipbf-g__donnees > .ipbf-g__table-wrap { display: block; }
}
@media (prefers-reduced-motion: reduce) {
	.ipbf-g * { transition: none !important; }
}
@media (forced-colors: active) {
	.ipbf-g__barre,
	.ipbf-g__seg,
	.ipbf-g__col,
	.ipbf-g__pastille { forced-color-adjust: none; }
}