/*
 * Style de bloc « Puces étoile » sur core/list.
 * Réf design : Figma 14749:5635 (section « Ce que vous trouverez à l'intérieur »).
 *
 * Un élément = un titre en Intro Rust, puis une ligne de détail en DM Sans
 * gras. Le titre est le <strong> de l'élément, ce qui se saisit d'un Ctrl+B
 * dans l'éditeur ; il passe à la ligne ici, pas par un <br> dans le contenu.
 *
 * La puce est l'étoile orange du fichier, posée en fond : list-style-image ne
 * se dimensionne pas et ::marker ne se positionne pas.
 * ------------------------------------------------------------------------- */

.wp-block-list.is-style-puces {
	/* Pas du titre, réutilisé pour centrer la puce sur sa première ligne. */
	--dda-puce-titre: var(--wp--preset--font-size--2-xl, 2rem);
	--dda-puce-titre-lh: 1.25;
	--dda-puce-taille: 24px;

	padding-inline-start: 0;
	list-style: none;
}

.is-style-puces > li {
	position: relative;
	padding-inline-start: calc(var(--dda-puce-taille) + 10px);
	color: var(--wp--preset--color--noir, #1f2937);
	font-family: var(--wp--preset--font-family--body, "DM Sans", sans-serif);
	font-size: var(--wp--preset--font-size--lg, 1.25rem);
	font-weight: 700;
	line-height: 1.4;
}

.is-style-puces > li + li {
	margin-block-start: 16px;
}

.is-style-puces > li::before {
	content: "";
	position: absolute;
	top: calc((var(--dda-puce-titre) * var(--dda-puce-titre-lh) - var(--dda-puce-taille)) / 2);
	left: 0;
	width: var(--dda-puce-taille);
	height: var(--dda-puce-taille);
	background: url("../img/puce-etoile.svg") no-repeat center / contain;
}

.is-style-puces > li > strong:first-child {
	display: block;
	margin-block-end: 4px;
	font-family: var(--wp--preset--font-family--headings, "Intro Rust", sans-serif);
	font-size: var(--dda-puce-titre);
	font-weight: 700;
	line-height: var(--dda-puce-titre-lh);
	letter-spacing: -2px;
}