/**
 * Atzori Delivery Info — styles du bloc.
 *
 * Trois principes :
 *
 * 1. La date de livraison est l'information principale : elle seule porte un
 *    poids de 600. Le compte à rebours et les éléments de réassurance sont
 *    volontairement plus discrets, pour ne pas concurrencer le prix ni le
 *    bouton d'achat.
 * 2. Aucune couleur opaque, aucune ombre, aucune police imposée : les fonds et
 *    les filets sont semi-transparents, donc lisibles aussi bien sur un thème
 *    clair que sur un thème sombre, et les tailles sont en em pour suivre la
 *    typographie du thème.
 * 3. Les présélections sont des structures différentes (filets, barre, panneau,
 *    encadré, tableau, étapes, ligne compacte), pas huit variantes de carte.
 */

/* =====================================================================
 * 1. Neutralisation des styles de thème
 *
 * Les thèmes WooCommerce habillent largement ul, li et table. Ces règles
 * sont écrites avec la classe doublée (.adi-block.adi-block) pour passer
 * devant la plupart des sélecteurs de thème sans recourir à !important.
 * Si un thème résiste malgré tout, l'option « Renforcer les styles »
 * ajoute la classe .adi-force, qui rend ces mêmes règles prioritaires.
 * ================================================================== */

.adi-block.adi-block ul,
.adi-block.adi-block ol,
.adi-block.adi-block li {
	list-style: none;
	margin: 0;
	padding: 0;
	background: none;
	border: 0;
	text-indent: 0;
}

.adi-block.adi-block li::before,
.adi-block.adi-block li::marker {
	content: none;
}

.adi-block.adi-block table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	background: none;
	font-size: inherit;
	table-layout: auto;
}

.adi-block.adi-block tr,
.adi-block.adi-block th,
.adi-block.adi-block td {
	background: none;
	border: 0;
	padding: 0;
	text-align: left;
	vertical-align: baseline;
	font-size: inherit;
}

.adi-block.adi-block p {
	margin: 0;
}

.adi-block.adi-block img {
	max-width: 100%;
	height: auto;
	display: block;
	box-shadow: none;
	border: 0;
	border-radius: 0;
}

.adi-block.adi-block a {
	box-shadow: none;
}

/* Renforcement, si le thème impose malgré tout ses listes ou ses tableaux. */
.adi-force.adi-force ul,
.adi-force.adi-force ol,
.adi-force.adi-force li {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	background: none !important;
	border: 0 !important;
}

.adi-force.adi-force li::before,
.adi-force.adi-force li::marker {
	content: none !important;
}

.adi-force.adi-force table,
.adi-force.adi-force tr,
.adi-force.adi-force th,
.adi-force.adi-force td {
	background: none !important;
	border: 0 !important;
	width: auto !important;
	box-shadow: none !important;
}

.adi-force.adi-force table {
	width: 100% !important;
	border-collapse: collapse !important;
}

/* =====================================================================
 * 2. Socle commun
 * ================================================================== */

.adi-block {
	--adi-icon-size: 20px;
	--adi-gap: 10px;
	--adi-radius: 6px;
	--adi-accent: currentColor;
	--adi-accent-soft: rgba(128, 128, 128, .07);
	--adi-accent-line: rgba(128, 128, 128, .3);
	--adi-line: rgba(128, 128, 128, .28);

	box-sizing: border-box;
	margin: var(--adi-gap) 0;
	font-size: 0.95em;
	line-height: 1.45;
	text-align: left;
}

.adi-block *,
.adi-block *::before,
.adi-block *::after {
	box-sizing: border-box;
}

.adi-own-colors {
	color: var(--adi-text, inherit);
	background-color: var(--adi-bg, transparent);
}

/* Lignes estimation et compte à rebours ------------------------------- */

.adi-row {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 0 0 4px;
}

.adi-row:last-child {
	margin-bottom: 0;
}

.adi-row[hidden] {
	display: none;
}

/**
 * L'accent est mélangé à la couleur du texte avant d'être appliqué.
 * Sur un thème clair, il reste lui-même ; sur un thème sombre, il
 * s'éclaircit et reste visible. Un accent foncé comme « Encre » tombe
 * sinon à un contraste de 1,35 sur fond sombre, donc invisible.
 * La première déclaration sert de repli aux navigateurs anciens.
 */
/* La variable est redéclarée sur chaque icône : en mode « couleurs variées »,
   chaque pictogramme porte son propre --adi-accent et doit donc recalculer sa
   teinte visible, au lieu d'hériter de celle du bloc. */
.adi-block,
.adi-block .adi-ico {
	--adi-accent-vis: var(--adi-accent);
}

@supports (color: color-mix(in srgb, red 50%, blue)) {
	.adi-block,
	.adi-block .adi-ico {
		--adi-accent-vis: color-mix(in srgb, var(--adi-accent) 72%, currentColor);
	}
}

.adi-ico {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--adi-icon-size);
	height: var(--adi-icon-size);
	line-height: 0;
	color: var(--adi-accent-vis);
}

.adi-ico .adi-icon {
	display: block;
	width: 100%;
	height: 100%;
}

.adi-icon-custom {
	object-fit: contain;
}

.adi-text {
	flex: 1 1 auto;
	min-width: 0;
}

/* La date : seule information en gras du bloc. */
.adi-estimate .adi-text {
	font-weight: 600;
	font-size: 1.02em;
}

.adi-countdown .adi-text {
	font-size: 0.92em;
	opacity: 0.72;
}

/* Éléments de réassurance ---------------------------------------------- */

.adi-badges {
	display: grid;
	gap: 7px 18px;
	margin-top: var(--adi-gap);
}

.adi-badge {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.adi-badge-text {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.adi-badge-text strong {
	font-weight: 500;
}

.adi-badge-sub {
	font-size: 0.86em;
	opacity: 0.62;
}

.adi-badge-link {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	text-decoration: none;
	color: inherit;
}

.adi-badge-link:hover .adi-badge-text strong,
.adi-badge-link:focus .adi-badge-text strong {
	text-decoration: underline;
}

.adi-badge-link:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
	border-radius: 2px;
}

/* Dispositions des éléments de réassurance ----------------------------- */

.adi-badges-list .adi-badges {
	grid-template-columns: 1fr;
}

.adi-badges-grid .adi-badges {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.adi-badges-row .adi-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
}

.adi-badges-row .adi-badge-sub {
	display: none;
}

/* =====================================================================
 * 2 bis. Styles d'icône
 *
 * Le dessin ne change pas : seuls l'épaisseur du trait et le support
 * (rien, pastille teintée, pastille pleine) varient. Cinq options donc,
 * sans multiplier les fichiers ni les jeux d'icônes.
 * ================================================================== */

.adi-icons-bold .adi-icon {
	stroke-width: 2.1;
}

.adi-icons-soft .adi-ico,
.adi-icons-square .adi-ico,
.adi-icons-filled .adi-ico {
	width: calc(var(--adi-icon-size) + 14px);
	height: calc(var(--adi-icon-size) + 14px);
	padding: 7px;
}

.adi-icons-soft .adi-ico {
	background-color: var(--adi-accent-pill, rgba(128, 128, 128, .12));
	border-radius: 50%;
}

.adi-icons-square .adi-ico {
	background-color: var(--adi-accent-pill, rgba(128, 128, 128, .12));
	border-radius: calc(var(--adi-radius) * 0.8);
}

/* Pastille pleine : on garde la couleur d'accent exacte, car c'est sur elle
   que la couleur du dessin a été choisie côté serveur pour rester lisible. */
.adi-icons-filled .adi-ico {
	background-color: var(--adi-accent);
	border-radius: 50%;
	color: var(--adi-on-accent, #fff);
}

/* Avec une pastille, la ligne de texte se centre sur l'icône. */
.adi-icons-soft .adi-row,
.adi-icons-square .adi-row,
.adi-icons-filled .adi-row,
.adi-icons-soft .adi-badge,
.adi-icons-square .adi-badge,
.adi-icons-filled .adi-badge,
.adi-icons-soft .adi-badge-link,
.adi-icons-square .adi-badge-link,
.adi-icons-filled .adi-badge-link {
	align-items: center;
}

.adi-icons-soft .adi-badges,
.adi-icons-square .adi-badges,
.adi-icons-filled .adi-badges {
	gap: 10px 18px;
}

/* =====================================================================
 * 2 ter. Animations
 *
 * Toutes sont discrètes et facultatives. Celles qui ne répondent pas à
 * une action restent limitées à une seule apparition, sauf la pulsation
 * du compte à rebours, qui signale une échéance. Le réglage système
 * « réduire les animations » les neutralise toutes (fin de fichier).
 * ================================================================== */

.adi-anim-hover .adi-ico {
	transition: transform .18s ease;
}

.adi-anim-hover:hover .adi-ico {
	transform: translateY(-2px);
}

@keyframes adi-rise {
	from {
		opacity: 0;
		transform: translateY(4px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

.adi-anim-reveal .adi-row,
.adi-anim-reveal .adi-badge,
.adi-anim-reveal .adi-step,
.adi-anim-reveal .adi-table tr {
	animation: adi-rise .4s ease both;
}

.adi-anim-reveal .adi-badge:nth-child(2),
.adi-anim-reveal .adi-step:nth-child(2),
.adi-anim-reveal .adi-table tr:nth-child(2) {
	animation-delay: .07s;
}

.adi-anim-reveal .adi-badge:nth-child(3),
.adi-anim-reveal .adi-step:nth-child(3),
.adi-anim-reveal .adi-table tr:nth-child(3) {
	animation-delay: .14s;
}

.adi-anim-reveal .adi-badge:nth-child(4) {
	animation-delay: .21s;
}

.adi-anim-reveal .adi-badge:nth-child(5) {
	animation-delay: .28s;
}

.adi-anim-reveal .adi-badge:nth-child(n+6) {
	animation-delay: .35s;
}

@keyframes adi-pulse {
	0%,
	100% {
		transform: scale(1);
	}

	50% {
		transform: scale(1.12);
	}
}

.adi-anim-pulse .adi-countdown .adi-ico {
	animation: adi-pulse 2.6s ease-in-out infinite;
}

/* =====================================================================
 * 3. Présélections
 * ================================================================== */

/* Épuré : rien d'autre que le texte. */

/* Filets : une séparation au-dessus et en dessous. */
.adi-preset-rule {
	border-top: 1px solid var(--adi-line);
	border-bottom: 1px solid var(--adi-line);
	padding: calc(var(--adi-gap) * 0.9) 0;
}

/* Barre d'accent : marque l'information sans l'enfermer. */
.adi-preset-accent {
	border-left: 3px solid var(--adi-accent-vis);
	padding: 2px 0 2px calc(var(--adi-gap) + 2px);
}

/* Panneau teinté : fond à 8 % de la couleur d'accent, sans bordure. */
.adi-preset-panel {
	background-color: var(--adi-accent-soft);
	border-radius: var(--adi-radius);
	padding: calc(var(--adi-gap) * 0.95) calc(var(--adi-gap) * 1.1);
}

/* Encadré : bordure fine, pas d'ombre. */
.adi-preset-outline {
	border: 1px solid var(--adi-line);
	border-radius: var(--adi-radius);
	padding: calc(var(--adi-gap) * 0.95) calc(var(--adi-gap) * 1.1);
}

/* Compact : deux lignes, réassurance séparée par des traits. */
.adi-preset-compact .adi-row {
	margin-bottom: 2px;
}

.adi-preset-compact .adi-estimate .adi-text {
	font-size: 1em;
}

.adi-preset-compact .adi-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 0;
	margin-top: calc(var(--adi-gap) * 0.7);
}

.adi-preset-compact .adi-badge {
	gap: 6px;
	padding: 0 12px;
	border-left: 1px solid var(--adi-line);
}

.adi-preset-compact .adi-badge:first-child {
	padding-left: 0;
	border-left: 0;
}

.adi-preset-compact .adi-badge-sub {
	display: none;
}

.adi-preset-compact .adi-ico {
	width: calc(var(--adi-icon-size) * 0.8);
	height: calc(var(--adi-icon-size) * 0.8);
}

/* =====================================================================
 * 4. Tableau des délais
 * ================================================================== */

.adi-table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 2px;
}

.adi-table tr + tr .adi-cell-label,
.adi-table tr + tr .adi-cell-value {
	border-top: 1px solid var(--adi-line);
}

.adi-cell-label,
.adi-cell-value {
	padding: 7px 0;
	vertical-align: baseline;
}

.adi-cell-label {
	width: 42%;
	padding-right: 12px;
	font-weight: 400;
	opacity: 0.68;
	font-size: 0.93em;
}

.adi-cell-value {
	font-weight: 600;
}

.adi-preset-table {
	border: 1px solid var(--adi-line);
	border-radius: var(--adi-radius);
	padding: calc(var(--adi-gap) * 0.4) calc(var(--adi-gap) * 1.1) calc(var(--adi-gap) * 0.95);
}

.adi-preset-table .adi-countdown {
	margin-top: 6px;
}

.adi-preset-table .adi-badges {
	margin-top: calc(var(--adi-gap) * 0.9);
	padding-top: calc(var(--adi-gap) * 0.9);
	border-top: 1px solid var(--adi-line);
}

/* =====================================================================
 * 5. Étapes
 * Le contenu est réellement une séquence : préparation, expédition,
 * livraison. La numérotation visuelle est donc justifiée ici, et nulle
 * part ailleurs.
 * ================================================================== */

.adi-steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0;
	margin: 2px 0 0;
	counter-reset: adi-step;
}

.adi-step {
	position: relative;
	padding: 20px 10px 0 0;
}

.adi-step:last-child {
	padding-right: 0;
}

/* Le trait de progression relie les points, sans dépasser aux extrémités. */
.adi-step::before {
	content: "";
	position: absolute;
	top: 5px;
	left: 11px;
	right: 0;
	height: 1px;
	background: var(--adi-accent-line);
}

.adi-step:last-child::before {
	right: auto;
	width: 0;
}

.adi-step::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 11px;
	height: 11px;
	border-radius: 50%;
	border: 2px solid var(--adi-accent-vis);
	background: var(--adi-bg, transparent);
}

.adi-step-done::after {
	background: var(--adi-accent-vis);
}

.adi-step-label {
	display: block;
	font-size: 0.85em;
	opacity: 0.62;
}

.adi-step-value {
	display: block;
	font-weight: 600;
	font-size: 0.97em;
}

.adi-preset-steps .adi-countdown {
	margin-top: 10px;
}

/* =====================================================================
 * 5 bis. Mises en forme hiérarchisées
 *
 * La date, le délai restant et les garanties ne sont pas trois
 * informations de même poids : ces cinq présélections mettent la
 * réponse à la question du client au premier plan et font reculer
 * le reste, au lieu d'encadrer chaque ligne de la même façon.
 * ================================================================== */

/* --- Date en chiffres ------------------------------------------------ */

.adi-figure {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 11px 13px;
	border: 1px solid var(--adi-line);
	border-radius: var(--adi-radius);
}

.adi-figure-num {
	flex: 0 0 auto;
	text-align: center;
	line-height: 1;
	padding-right: 14px;
	border-right: 1px solid var(--adi-line);
}

.adi-figure-num b {
	display: block;
	font-size: 1.62em;
	font-weight: 700;
	letter-spacing: -0.02em;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.adi-figure-num span {
	display: block;
	margin-top: 3px;
	font-size: 0.8em;
	opacity: 0.6;
}

.adi-figure-num span:empty {
	display: none;
}

.adi-figure-what {
	min-width: 0;
}

.adi-figure-what b {
	display: block;
	font-weight: 600;
}

.adi-figure-what span {
	display: block;
	font-size: 0.9em;
	opacity: 0.62;
}

.adi-preset-calendar .adi-countdown {
	margin-top: 8px;
}

.adi-block.adi-preset-calendar .adi-badges {
	margin-top: 11px;
	padding-top: 10px;
	border-top: 1px solid var(--adi-line);
	gap: 6px 18px;
}

.adi-preset-calendar .adi-badge-sub {
	display: none;
}

/* Garanties courtes : deux colonnes par défaut, sauf si une autre
   disposition a été choisie dans l'onglet Réassurance. */
.adi-block.adi-preset-calendar.adi-badges-list .adi-badges {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* --- Bon de livraison ------------------------------------------------- */

.adi-block.adi-preset-docket .adi-table {
	border-top: 2px dashed var(--adi-line);
	border-left: 1px solid var(--adi-line);
	border-right: 1px solid var(--adi-line);
	border-bottom: 1px solid var(--adi-line);
	border-radius: 0 0 var(--adi-radius) var(--adi-radius);
	padding: 10px 14px;
}

.adi-block.adi-preset-docket .adi-table tr {
	display: flex;
	align-items: baseline;
	gap: 8px;
}

.adi-block.adi-preset-docket .adi-cell-label,
.adi-block.adi-preset-docket .adi-cell-value {
	border-top: 0;
	padding: 5px 0;
	width: auto;
}

/* Le filet à pointillés relie le libellé à sa valeur, comme sur un bon. */
.adi-block.adi-preset-docket .adi-cell-label {
	display: flex;
	align-items: baseline;
	gap: 8px;
	flex: 1 1 auto;
}

.adi-preset-docket .adi-cell-label::after {
	content: "";
	flex: 1 1 auto;
	min-width: 16px;
	border-bottom: 1px dotted var(--adi-line);
	transform: translateY(-3px);
}

.adi-preset-docket .adi-cell-value {
	/* La valeur peut se réduire si la place manque, plutôt que déborder. */
	flex: 0 1 auto;
	min-width: 0;
	font-variant-numeric: tabular-nums;
}

.adi-block.adi-preset-docket .adi-table tr:last-child .adi-cell-value {
	font-size: 1.08em;
}

.adi-preset-docket .adi-countdown {
	margin: 8px 14px 0;
}

.adi-block.adi-preset-docket .adi-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 10px;
}

.adi-block.adi-preset-docket .adi-badge {
	gap: 6px;
	padding: 5px 10px;
	border: 1px solid var(--adi-line);
	border-radius: 4px;
	font-size: 0.88em;
	align-items: center;
}

.adi-preset-docket .adi-badge-sub {
	display: none;
}

.adi-preset-docket .adi-ico {
	width: calc(var(--adi-icon-size) * 0.8);
	height: calc(var(--adi-icon-size) * 0.8);
}

/* --- Deux colonnes ----------------------------------------------------- */

.adi-preset-split {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	gap: 14px;
	align-items: stretch;
}

/* Le panneau occupe toute la hauteur de la colonne et centre son contenu :
   sans cela il flotte au milieu d'une colonne plus haute que lui. */
.adi-panel-main {
	background-color: var(--adi-accent-soft);
	border-radius: var(--adi-radius);
	padding: 12px 14px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.adi-panel-label {
	display: block;
	font-size: 0.84em;
	opacity: 0.62;
}

.adi-panel-value {
	display: block;
	margin-top: 2px;
	font-weight: 700;
	font-size: 1.1em;
	letter-spacing: -0.01em;
}

.adi-panel-foot {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: 8px;
	padding-top: 8px;
	border-top: 1px solid rgba(128, 128, 128, .2);
	font-size: 0.85em;
	opacity: 0.75;
}

.adi-panel-foot .adi-ico {
	width: 1em;
	height: 1em;
}

.adi-block.adi-preset-split .adi-badges {
	margin-top: 0;
	gap: 7px;
	align-content: center;
}

.adi-preset-split .adi-countdown {
	grid-column: 1 / -1;
	margin-top: 0;
}

/* --- Compteur ----------------------------------------------------------- */

.adi-counter {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 11px 14px;
	background-color: var(--adi-accent-soft);
	border-left: 3px solid var(--adi-accent-vis);
	border-radius: 0 var(--adi-radius) var(--adi-radius) 0;
}

.adi-counter .adi-ico {
	flex: 0 0 auto;
}

.adi-counter-time {
	flex: 0 0 auto;
	font-size: 1.5em;
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.02em;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.adi-counter-what {
	min-width: 0;
}

.adi-counter-what b {
	display: block;
	font-weight: 600;
	font-size: 0.95em;
}

.adi-counter-what > span {
	display: block;
	font-size: 0.86em;
	opacity: 0.62;
}

.adi-block.adi-preset-counter .adi-badges {
	margin-top: 10px;
	padding-top: 9px;
	border-top: 1px solid var(--adi-line);
	display: flex;
	flex-wrap: wrap;
	gap: 5px 0;
	font-size: 0.9em;
}

.adi-block.adi-preset-counter .adi-badge {
	padding: 0 12px;
	border-left: 1px solid var(--adi-line);
	align-items: center;
}

.adi-block.adi-preset-counter .adi-badge:first-child {
	padding-left: 0;
	border-left: 0;
}

.adi-preset-counter .adi-badge-sub {
	display: none;
}

.adi-preset-counter .adi-ico {
	width: calc(var(--adi-icon-size) * 0.8);
	height: calc(var(--adi-icon-size) * 0.8);
}

/* --- Fiche technique ------------------------------------------------------ */

.adi-block.adi-preset-spec .adi-table tr {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
}

.adi-block.adi-preset-spec .adi-cell-label,
.adi-block.adi-preset-spec .adi-cell-value {
	width: auto;
	border-top: 0;
	padding: 8px 0;
}

.adi-block.adi-preset-spec .adi-table tr {
	border-bottom: 1px solid var(--adi-line);
}

.adi-block.adi-preset-spec .adi-table tr:first-child {
	border-top: 1px solid var(--adi-line);
}

.adi-block.adi-preset-spec .adi-cell-value {
	flex: 0 1 auto;
	min-width: 0;
	text-align: right;
	font-variant-numeric: tabular-nums;
}

.adi-block.adi-preset-spec .adi-table tr:last-child .adi-cell-value {
	font-size: 1.06em;
}

.adi-block.adi-preset-spec .adi-badges {
	display: block;
	margin-top: 0;
}

.adi-block.adi-preset-spec .adi-badge {
	align-items: baseline;
	gap: 9px;
	padding: 8px 0;
	border-bottom: 1px solid var(--adi-line);
}

.adi-preset-spec .adi-badge-text {
	flex: 1 1 auto;
	flex-direction: row;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
}

.adi-preset-spec .adi-badge-sub {
	text-align: right;
	flex: 0 0 auto;
}

.adi-block.adi-preset-spec .adi-badge:last-child {
	border-bottom: 0;
}

.adi-preset-spec .adi-countdown {
	margin-top: 9px;
}

/* =====================================================================
 * 6. Écrans étroits
 * ================================================================== */

@media (max-width: 600px) {
	.adi-badges-grid .adi-badges {
		grid-template-columns: 1fr;
	}

	.adi-badges-row .adi-badges {
		flex-direction: column;
		gap: 7px;
	}

	.adi-badges-row .adi-badge-sub {
		display: block;
	}

	.adi-preset-compact .adi-badges {
		display: grid;
		grid-template-columns: 1fr;
		gap: 5px;
	}

	.adi-preset-compact .adi-badge {
		padding: 0;
		border-left: 0;
	}

	/* Les étapes passent en colonne : le trait devient vertical. */
	.adi-steps {
		grid-template-columns: 1fr;
	}

	.adi-step {
		padding: 0 0 12px 22px;
	}

	.adi-step:last-child {
		padding-bottom: 0;
	}

	.adi-step::before {
		top: 11px;
		bottom: 0;
		left: 5px;
		right: auto;
		width: 1px;
		height: auto;
	}

	.adi-step:last-child::before {
		display: none;
	}

	.adi-cell-label {
		width: 46%;
	}

	/* Les mises en forme hiérarchisées sur téléphone. */
	.adi-preset-split {
		grid-template-columns: 1fr;
		gap: 10px;
	}

	.adi-counter {
		flex-wrap: wrap;
		gap: 8px 12px;
	}

	.adi-counter-what {
		flex: 1 0 100%;
	}

	.adi-block.adi-preset-counter .adi-badge {
		flex: 1 0 100%;
		padding: 0;
		border-left: 0;
	}

	.adi-preset-spec .adi-badge-text {
		flex-direction: column;
		gap: 0;
	}

	.adi-preset-spec .adi-badge-sub {
		text-align: left;
	}

	.adi-block.adi-preset-calendar.adi-badges-list .adi-badges {
		grid-template-columns: 1fr;
	}
}

/* Sur téléphone, la valeur passe sous son libellé : en deux colonnes, une
   fourchette de dates déborde sur deux lignes et se lit mal. */
@media (max-width: 460px) {
	.adi-table,
	.adi-table tbody,
	.adi-table tr {
		display: block;
	}

	.adi-cell-label,
	.adi-cell-value {
		display: block;
		width: auto;
		padding: 0;
	}

	.adi-table tr + tr {
		margin-top: 8px;
		padding-top: 8px;
		border-top: 1px solid var(--adi-line);
	}

	.adi-table tr + tr .adi-cell-label,
	.adi-table tr + tr .adi-cell-value {
		border-top: 0;
	}

	/* Le bon de livraison et la fiche technique mettent leurs lignes en
	   flex : sur un écran étroit, la valeur ne peut plus tenir à côté du
	   libellé et déborderait. On empile, et le filet à pointillés n'a plus
	   de raison d'être. */
	.adi-block.adi-preset-docket .adi-table tr,
	.adi-block.adi-preset-spec .adi-table tr {
		display: block;
	}

	.adi-block.adi-preset-docket .adi-cell-label::after {
		display: none;
	}

	.adi-block.adi-preset-spec .adi-cell-value,
	.adi-block.adi-preset-docket .adi-cell-value {
		text-align: left;
		padding-top: 0;
	}

	.adi-block.adi-preset-docket .adi-cell-label,
	.adi-block.adi-preset-spec .adi-cell-label {
		padding-bottom: 1px;
	}
}

/**
 * Préférence système « réduire les animations » : rien ne bouge, quelle que
 * soit l'option choisie dans l'administration, et le bloc reste entièrement
 * visible (une apparition interrompue ne doit jamais laisser un texte à zéro
 * d'opacité).
 */
@media (prefers-reduced-motion: reduce) {
	.adi-block *,
	.adi-block *::before,
	.adi-block *::after {
		animation: none !important;
		transition: none !important;
	}

	.adi-block .adi-row,
	.adi-block .adi-badge,
	.adi-block .adi-step,
	.adi-block .adi-table tr {
		opacity: 1 !important;
		transform: none !important;
	}
}