/*
 * Encarts de sélection — habillage front.
 *
 * PROVENANCE. Ce design est celui perdu avec les versions 0.22–0.25, retrouvé
 * le 2026-08-19 dans le cache de Penci PageSpeed Optimizer (il avait mis en
 * ligne le handle `mbp-sel-styles` le 18/08 à 17:29, trois heures avant
 * l'effacement des sources). Remis en forme, commenté, et complété du système
 * de couleurs par catégorie qui, lui, venait de l'ancienne feuille.
 *
 * PONT DE JETONS. Chaque couleur s'écrit `var(--mbp-color-x, <valeur>)` : le
 * repli EST la charte, donc l'encart est juste sous le thème ACTUEL (qui ne
 * définit aucun jeton) ; et quand le thème enfant v2 posera ses `--mbp-color-*`
 * sur :root, l'encart les adoptera sans republier le plugin.
 *
 * AUCUNE police n'est chargée ici : `--mbp-sel-font-serif` retombe sur Georgia.
 * Charger Google Fonts depuis une extension coûterait une requête bloquante et
 * poserait une question de consentement (Complianz) pour un titre.
 *
 * COULEURS : UNIQUEMENT CELLES DU THÈME (25/09/2026). `--mbp-sel-primary` vaut
 * l'accent du thème (`--mbp-color-accent`), point. Plus de couleur par
 * catégorie, par méta `post_accent_color`, par `color=` de shortcode ni par
 * sondage du titre précédent : le système de couleurs par article est abandonné.
 */

:root {
	--mbp-sel-bg: var(--mbp-color-surface-card, #faf8f5);
	--mbp-sel-border-color: var(--mbp-color-border, #eae6e0);
	--mbp-sel-card-bg: var(--mbp-color-surface, #fff);
	--mbp-sel-text-color: var(--mbp-color-text, #2c3038);
	--mbp-sel-heading-color: var(--mbp-color-heading, #121824);
	--mbp-sel-text-muted: var(--mbp-color-text-muted, #5e6b7c);
	--mbp-sel-on-accent: var(--mbp-color-on-accent, #fff);
	--mbp-sel-terracotta: var(--mbp-color-terracotta, #b44f25);
	--mbp-sel-terracotta-subtle: var(--mbp-color-terracotta-subtle, #fcf1eb);

	--mbp-sel-font-serif: var(--mbp-font-serif, "Playfair Display", Georgia, serif);
	--mbp-sel-font-sans: var(--mbp-font-sans, "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);

	--mbp-sel-radius-sm: var(--mbp-radius-sm, 8px);
	--mbp-sel-radius-md: var(--mbp-radius-md, 14px);
	--mbp-sel-radius-pill: var(--mbp-radius-pill, 9999px);
	--mbp-sel-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
	--mbp-sel-shadow-hover: 0 12px 30px rgba(0, 0, 0, 0.08);
}

/* `--mbp-sel-primary` : l'accent du thème, rien d'autre (voir l'en-tête). */
.mbp-sel-box {
	--mbp-sel-primary: var(--mbp-color-accent, #1e6b45);
	--mbp-sel-primary-hover: var(--mbp-color-accent-hover, #144d31);

	/* Le filet vertical du design retrouvé suit l'accent du thème. */
	--mbp-sel-border-accent: var(--mbp-sel-primary);

	background: var(--mbp-sel-bg);
	border: 1px solid var(--mbp-sel-border-color);
	border-left: 4px solid var(--mbp-sel-border-accent);
	border-radius: var(--mbp-sel-radius-md);
	padding: 26px 28px;
	margin: 2.5em 0;
	box-shadow: var(--mbp-sel-shadow);
	font-family: var(--mbp-sel-font-sans);
	box-sizing: border-box;
}

/* Les accents par catégorie (inertes sur un article) ont été retirés le 25/09/2026. */

/* ── En-tête de l'encart ─────────────────────────────────────────────────── */

.mbp-sel-header {
	margin-bottom: 22px;
}

.mbp-sel-badge-top {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	width: fit-content;
	margin-bottom: 10px;
	padding: 4px 10px;
	border-radius: var(--mbp-sel-radius-pill);
	background: var(--mbp-sel-terracotta-subtle);
	color: var(--mbp-sel-terracotta);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.7px;
	line-height: 1.2;
	text-transform: uppercase;
}

/* Étoile en masque CSS : elle hérite de `currentColor`, donc elle suit la
   terracotta en clair comme en sombre sans qu'on redéclare l'icône. */
.mbp-sel-badge-top::before {
	content: "";
	display: inline-block;
	width: 12px;
	height: 12px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2'%3E%3C/polygon%3E%3C/svg%3E") no-repeat center/contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2'%3E%3C/polygon%3E%3C/svg%3E") no-repeat center/contain;
}

/* Soledad remet `padding: 0` et une bordure sur les titres du contenu : sans
   !important le titre reprend l'habillage du thème. */
.mbp-sel-title {
	margin: 0 0 8px 0 !important;
	padding: 0 !important;
	border: none !important;
	font-family: var(--mbp-sel-font-serif) !important;
	font-size: 22px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	color: var(--mbp-sel-heading-color) !important;
}

.mbp-sel-subtitle {
	margin: 0 !important;
	font-size: 14.5px !important;
	line-height: 1.55 !important;
	color: var(--mbp-sel-text-muted) !important;
}

/* ── La grille ───────────────────────────────────────────────────────────── */

.mbp-sel-grid {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 16px !important;
	margin: 0 !important;
	padding: 0 !important;
}

.mbp-sel-card {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	flex: 1 1 calc(33.333% - 16px);
	min-width: 230px;
	box-sizing: border-box;
	margin: 0 !important;
	padding: 16px 16px !important;
	background: var(--mbp-sel-card-bg);
	border: 1px solid var(--mbp-sel-border-color);
	border-radius: var(--mbp-sel-radius-sm);
	box-shadow: var(--mbp-sel-shadow);
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.mbp-sel-card:hover {
	transform: translateY(-3px);
	box-shadow: var(--mbp-sel-shadow-hover);
	border-color: var(--mbp-sel-primary);
}

.mbp-sel-content {
	flex-grow: 1;
	margin-bottom: 10px;
}

.mbp-sel-name {
	margin: 0 0 4px 0 !important;
	font-family: var(--mbp-sel-font-sans) !important;
	font-size: 15.5px !important;
	font-weight: 700 !important;
	line-height: 1.35 !important;
}

.mbp-sel-name a {
	color: var(--mbp-sel-heading-color);
	text-decoration: none !important;
	transition: color 0.2s ease;
}

.mbp-sel-name a:hover {
	color: var(--mbp-sel-primary);
}

.mbp-sel-partner {
	display: inline-block;
	margin-bottom: 10px;
	font-size: 11.5px;
	font-style: italic;
	line-height: 1.2;
	color: var(--mbp-sel-text-muted);
}

/*
 * Pastille et argument par carte — ABSENTS du design retrouvé, réhabillés ici.
 * Les entités peuvent porter un `badge` et un `usp` par langue
 * (entity.labels_by_lang) : les laisser sans style ferait disparaître du texte
 * que l'éditeur a saisi. Rien ne s'affiche tant qu'ils ne sont pas renseignés.
 */
.mbp-sel-badge {
	align-self: flex-start;
	display: inline-block;
	margin-bottom: 8px;
	padding: 3px 9px;
	border-radius: var(--mbp-sel-radius-pill);
	background: var(--mbp-sel-terracotta-subtle);
	color: var(--mbp-sel-terracotta);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.6px;
	line-height: 1.2;
	text-transform: uppercase;
}

/* Familles de pastilles : mêmes teintes que les accents de catégorie, toutes
   mesurées ≥ 5,1:1 avec du blanc. */
.mbp-badge-coup-de-coeur,
.mbp-badge-coup-de-c-ur,
.mbp-badge-favori {
	background: #b44f25;
	color: #fff;
}

.mbp-badge-budget,
.mbp-badge-bon-plan,
.mbp-badge-pas-cher {
	background: #2f6b34;
	color: #fff;
}

.mbp-badge-luxe,
.mbp-badge-prestige,
.mbp-badge-charme {
	background: #6b3f8e;
	color: #fff;
}

.mbp-badge-famille,
.mbp-badge-insolite {
	background: #1f5d7a;
	color: #fff;
}

.mbp-sel-usp {
	margin: 0 !important;
	font-size: 12.5px !important;
	line-height: 1.5 !important;
	color: var(--mbp-sel-text-muted) !important;
}

/* ── Actions ─────────────────────────────────────────────────────────────── */

.mbp-sel-actions {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: auto;
	padding-top: 12px;
	border-top: 1px solid var(--mbp-sel-border-color);
}

.mbp-sel-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	box-sizing: border-box;
	padding: 10px 18px;
	border-radius: var(--mbp-sel-radius-pill);
	background: var(--mbp-sel-primary);
	color: var(--mbp-sel-on-accent) !important;
	font-size: 13.5px;
	font-weight: 700;
	text-align: center;
	text-decoration: none !important;
	transition: background-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
	/* L'ombre colorée était figée en vert de charte : elle jurait dès qu'une
	   catégorie changeait l'accent. Dérivée, avec un repli neutre. */
	box-shadow: 0 3px 12px rgba(0, 0, 0, 0.16);
	box-shadow: 0 3px 12px color-mix(in srgb, var(--mbp-sel-primary) 32%, transparent);
}

.mbp-sel-cta:hover,
.mbp-sel-cta:focus-visible {
	background: var(--mbp-sel-primary-hover) !important;
	color: var(--mbp-sel-on-accent) !important;
	transform: translateY(-2px);
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.24);
	box-shadow: 0 6px 18px color-mix(in srgb, var(--mbp-sel-primary) 45%, transparent);
}

.mbp-sel-arrow {
	flex-shrink: 0;
	transition: transform 0.2s ease;
}

.mbp-sel-cta:hover .mbp-sel-arrow {
	transform: translateX(3px);
}

.mbp-sel-micro-note {
	margin-top: 1px;
	font-size: 11.5px;
	font-style: italic;
	line-height: 1.3;
	text-align: center;
	color: var(--mbp-sel-text-muted);
}



/* ── Variante dense : une ligne par adresse ──────────────────────────────────
 * Posée par BoxRenderer au-delà du seuil (6 par défaut, filtrable via
 * `mbp_affil_recap_dense_threshold`). Mesuré sur le corpus : 57 encarts sur 65
 * portent 2 à 4 adresses et gardent la carte ; seuls les longs basculent ici.
 * Rien n'est masqué — chaque adresse garde son lien, la hauteur est divisée.
 */

/* Deux colonnes, comme les cartes : passer la liste en UNE colonne annulerait
   le gain (mesuré — 11 lignes de 76 px valent 6 rangées de cartes à 161 px). */
.mbp-sel-box--dense .mbp-sel-grid {
	flex-wrap: wrap !important;
	gap: 0 24px !important;
}

.mbp-sel-box--dense .mbp-sel-card {
	flex: 1 1 calc(50% - 24px);
	min-width: 280px;
	flex-direction: row;
	align-items: center;
	gap: 16px;
	min-width: 0;
	padding: 12px 4px !important;
	background: transparent;
	border: 0;
	border-bottom: 1px solid var(--mbp-sel-border-color);
	border-radius: 0;
	box-shadow: none;
}

/* Pas de translation au survol dans une liste : la ligne sauterait par-dessus
   sa voisine. On souligne l'accent, c'est tout. */
.mbp-sel-box--dense .mbp-sel-card:hover {
	transform: none;
	box-shadow: none;
	border-color: var(--mbp-sel-border-color);
	background: rgba(0, 0, 0, 0.015);
}

.mbp-sel-box--dense .mbp-sel-content {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
}

.mbp-sel-box--dense .mbp-sel-name {
	margin: 0 !important;
	font-size: 14.5px !important;
}

.mbp-sel-box--dense .mbp-sel-partner {
	margin: 2px 0 0 0;
}

.mbp-sel-box--dense .mbp-sel-badge {
	margin: 0 0 0 8px;
	vertical-align: middle;
}

.mbp-sel-box--dense .mbp-sel-usp {
	display: none; /* la ligne doit rester une ligne */
}

.mbp-sel-box--dense .mbp-sel-actions {
	flex: 0 0 auto;
	margin: 0;
	padding: 0;
	border-top: 0;
}

.mbp-sel-box--dense .mbp-sel-cta {
	padding: 8px 16px;
	font-size: 12.5px;
	white-space: nowrap;
}

@media (max-width: 600px) {
	.mbp-sel-box--dense .mbp-sel-card {
		flex-direction: column;
		align-items: stretch;
		gap: 10px;
	}
	.mbp-sel-box--dense .mbp-sel-cta {
		width: 100%;
	}
}

/* ── Mobile : la grille devient un carrousel ─────────────────────────────── */

@media (max-width: 768px) {
	.mbp-sel-box {
		padding: 20px 16px;
		margin: 24px 0 28px 0;
	}
	.mbp-sel-title {
		font-size: 19px !important;
	}
	.mbp-sel-grid {
		flex-wrap: nowrap !important;
		overflow-x: auto !important;
		scroll-snap-type: x mandatory !important;
		scroll-behavior: smooth;
		-webkit-overflow-scrolling: touch;
		gap: 12px !important;
		padding: 4px 2px 14px 2px !important;
		margin: 0 -2px !important;
	}
	.mbp-sel-grid::-webkit-scrollbar {
		height: 5px;
	}
	.mbp-sel-grid::-webkit-scrollbar-track {
		background: rgba(0, 0, 0, 0.05);
		border-radius: 10px;
	}
	.mbp-sel-grid::-webkit-scrollbar-thumb {
		background: var(--mbp-sel-primary);
		border-radius: 10px;
	}
	.mbp-sel-card {
		flex: 0 0 265px !important;
		scroll-snap-align: start !important;
		padding: 16px 14px !important;
	}
}

/* ── Mode sombre ─────────────────────────────────────────────────────────────
 * Cinq sélecteurs : Soledad bascule par une classe sur <body> (trois variantes
 * selon la version et le réglage), et le thème enfant v2 posera l'attribut sur
 * <html>. On ne redéfinit QUE les jetons.
 *
 * `--mbp-sel-on-accent` passe au quasi-noir : l'accent s'éclaircit en mode
 * sombre, et le blanc y tomberait très en dessous du seuil AA.
 */
body.penci-dark-mode .mbp-sel-box,
body.dark-mode .mbp-sel-box,
body.pcdark-mode .mbp-sel-box,
body.pcdm-enable .mbp-sel-box,
html[data-theme="dark"] .mbp-sel-box {
	--mbp-sel-primary: var(--mbp-color-accent, #34d399);
	--mbp-sel-primary-hover: var(--mbp-color-accent-hover, #10b981);
	--mbp-sel-bg: #151d2a;
	--mbp-sel-border-color: #243144;
	--mbp-sel-card-bg: #1c2738;
	--mbp-sel-heading-color: #f1f5f9;
	--mbp-sel-text-color: #e2e8f0;
	--mbp-sel-text-muted: #94a3b8;
	--mbp-sel-on-accent: #04231a;
	--mbp-sel-terracotta: #fca5a5;
	--mbp-sel-terracotta-subtle: rgba(239, 68, 68, 0.15);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

/* ── Mouvement réduit ────────────────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
	.mbp-sel-grid {
		scroll-behavior: auto;
	}
	.mbp-sel-card,
	.mbp-sel-cta,
	.mbp-sel-name a,
	.mbp-sel-arrow {
		transition: none;
	}
	.mbp-sel-card:hover,
	.mbp-sel-cta:hover {
		transform: none;
	}
}

/* ── Présentation éditoriale v6 (25/09/2026) ──────────────────────────────
 * Une surface du thème, une ligne par adresse (photo du séjour, nom, « pour qui »,
 * actions), l'accent du thème pour le surtitre et les boutons, aucun filet coloré.
 * La mise en page suit la largeur de l'ENCART (requêtes de conteneur), jamais celle
 * de l'écran : étroite par défaut, actions à droite au-delà de 540 px.
 * Les `!important` neutralisent les règles historiques des cartes classiques.
 */
.mbp-sel-box.mbp-sel-box--editorial{
 --mbp-sel-ed-surface:var(--mbp-color-surface-soft,#f8f6f1);--mbp-sel-ed-card:var(--mbp-color-surface,#fff);
 --mbp-sel-ed-line:var(--mbp-color-border,#eae6e0);--mbp-sel-ed-ink:var(--mbp-color-heading,#121824);
 --mbp-sel-ed-text:var(--mbp-color-text,#2c3038);--mbp-sel-ed-muted:var(--mbp-color-text-muted,#5e6b7c);
 --mbp-sel-ed-accent:var(--mbp-color-accent,#1e6b45);--mbp-sel-ed-solid:var(--mbp-color-accent-solid,#1e6b45);
 --mbp-sel-ed-solid-hover:var(--mbp-color-accent-solid-hover,#144d31);--mbp-sel-ed-on-accent:var(--mbp-color-on-accent,#fff);
 container-type:inline-size;container-name:mbp-selection;
 background:var(--mbp-sel-ed-surface);color:var(--mbp-sel-ed-text);
 border:1px solid var(--mbp-sel-ed-line);border-radius:4px;box-shadow:none;
 padding:20px 20px 14px;margin:28px 0;font-family:var(--mbp-sel-font-sans);text-align:left;
}
.mbp-sel-box--editorial .mbp-sel-header{margin:0 0 4px;text-align:left}
.mbp-sel-box--editorial .mbp-sel-eyebrow{margin:0 0 4px!important;font:600 12px/1.5 var(--mbp-sel-font-sans)!important;letter-spacing:1.2px;text-transform:uppercase;color:var(--mbp-sel-ed-accent)!important}
/* Titres et noms : le thème habille les h2–h4 du contenu en !important ; la classe doublée garde la main. */
.mbp-sel-box.mbp-sel-box--editorial .mbp-sel-title.mbp-sel-title{margin:0!important;padding:0!important;border:0!important;background:none!important;font-family:var(--mbp-sel-font-serif)!important;font-size:21px!important;font-weight:500!important;line-height:1.3!important;letter-spacing:-.3px!important;text-transform:none!important;color:var(--mbp-sel-ed-ink)!important}
.mbp-sel-box--editorial .mbp-sel-title::before,.mbp-sel-box--editorial .mbp-sel-title::after{content:none!important;display:none!important}
.mbp-sel-box--editorial .mbp-sel-subtitle{margin:4px 0 0!important;font-size:14px!important;line-height:1.6!important;color:var(--mbp-sel-ed-muted)!important}
.mbp-sel-box--editorial .mbp-sel-group{margin:18px 0 0!important;padding:0 0 8px!important;border-bottom:1px solid var(--mbp-sel-ed-line);font:600 11px/1.5 var(--mbp-sel-font-sans)!important;letter-spacing:1.2px;text-transform:uppercase;color:var(--mbp-sel-ed-muted)!important}
.mbp-sel-box--editorial .mbp-sel-list{list-style:none!important;margin:10px 0 0!important;padding:0!important}
.mbp-sel-box--editorial .mbp-sel-group+.mbp-sel-list{margin-top:0!important}
.mbp-sel-box--editorial .mbp-sel-card{display:grid!important;grid-template-columns:56px minmax(0,1fr);column-gap:12px;align-items:start;list-style:none!important;
 margin:0!important;padding:12px 0!important;min-width:0;flex:none!important;background:transparent!important;border:0!important;border-bottom:1px solid var(--mbp-sel-ed-line)!important;border-radius:0!important;box-shadow:none!important;transform:none!important;transition:none!important}
.mbp-sel-box--editorial .mbp-sel-card::before,.mbp-sel-box--editorial .mbp-sel-card::marker{content:none!important}
.mbp-sel-box--editorial .mbp-sel-list>.mbp-sel-card:last-child{border-bottom:0!important}
.mbp-sel-box--editorial .mbp-sel-card:hover{transform:none!important;box-shadow:none!important}
.mbp-sel-box--editorial .mbp-sel-media{display:block;width:56px!important;height:56px!important;max-width:none!important;margin:0!important;border-radius:3px!important;object-fit:cover;background:var(--mbp-sel-ed-card);box-shadow:none!important}
.mbp-sel-box--editorial .mbp-sel-media--icon{display:grid;place-items:center;box-sizing:border-box;border:1px solid var(--mbp-sel-ed-line);color:var(--mbp-sel-ed-muted)}
.mbp-sel-box--editorial .mbp-sel-content{min-width:0;margin:0!important;flex:none}
.mbp-sel-box.mbp-sel-box--editorial .mbp-sel-name.mbp-sel-name{margin:0!important;padding:0!important;border:0!important;font:600 16px/1.35 var(--mbp-sel-font-sans)!important;letter-spacing:0!important;text-transform:none!important;color:var(--mbp-sel-ed-ink)!important}
.mbp-sel-box--editorial .mbp-sel-name a{color:inherit!important;text-decoration:none!important;background:none!important}
.mbp-sel-box--editorial .mbp-sel-name a:hover{text-decoration:underline!important;text-underline-offset:3px}
.mbp-sel-box--editorial .mbp-sel-meta{margin:2px 0 0!important;font:600 12px/1.5 var(--mbp-sel-font-sans)!important;color:var(--mbp-sel-ed-muted)!important}
.mbp-sel-box--editorial .mbp-sel-usp{margin:2px 0 0!important;font-size:14px!important;line-height:1.5!important;color:var(--mbp-sel-ed-text)!important}
.mbp-sel-box--editorial .mbp-sel-caveat{margin:6px 0 0!important;font-size:13px!important;font-style:normal!important;line-height:1.55!important;color:var(--mbp-sel-ed-muted)!important}
.mbp-sel-box--editorial .mbp-sel-caveat b{font-weight:600;color:var(--mbp-sel-ed-text)}
.mbp-sel-box--editorial .mbp-sel-actions{grid-column:2;display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:0 16px;margin:8px 0 0!important;padding:0!important;border:0!important}
.mbp-sel-box--editorial .mbp-sel-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;box-sizing:border-box;min-height:44px;margin:0!important;padding:8px 14px!important;
 border:1px solid var(--mbp-sel-ed-accent)!important;border-radius:4px!important;background:var(--mbp-sel-ed-card)!important;color:var(--mbp-sel-ed-accent)!important;
 font:600 13px/1.3 var(--mbp-sel-font-sans)!important;text-align:center;text-decoration:none!important;white-space:nowrap;box-shadow:none!important;transform:none!important}
.mbp-sel-box--editorial .mbp-sel-cta:hover,.mbp-sel-box--editorial .mbp-sel-cta:focus-visible{background:var(--mbp-sel-ed-solid)!important;border-color:var(--mbp-sel-ed-solid)!important;color:var(--mbp-sel-ed-on-accent)!important;box-shadow:none!important;transform:none!important}
.mbp-sel-box--editorial .mbp-sel-cta--primary{background:var(--mbp-sel-ed-solid)!important;border-color:var(--mbp-sel-ed-solid)!important;color:var(--mbp-sel-ed-on-accent)!important}
.mbp-sel-box--editorial .mbp-sel-cta--primary:hover,.mbp-sel-box--editorial .mbp-sel-cta--primary:focus-visible{background:var(--mbp-sel-ed-solid-hover)!important;border-color:var(--mbp-sel-ed-solid-hover)!important}
.mbp-sel-box--editorial .mbp-sel-arrow{transition:none}
.mbp-sel-box--editorial .mbp-sel-story,.mbp-sel-box--editorial .mbp-sel-links a{display:inline-flex;align-items:center;gap:4px;min-height:44px;margin:0!important;padding:0!important;border:0!important;background:none!important;
 font:600 13px/1.4 var(--mbp-sel-font-sans)!important;color:var(--mbp-sel-ed-ink)!important;text-decoration:underline!important;text-decoration-color:var(--mbp-sel-ed-line)!important;text-underline-offset:4px;white-space:nowrap}
.mbp-sel-box--editorial .mbp-sel-story:hover,.mbp-sel-box--editorial .mbp-sel-links a:hover{text-decoration-color:currentColor!important}
.mbp-sel-box--editorial .mbp-sel-links{display:flex;flex-wrap:wrap;gap:0 22px;margin:6px 0 0;padding:6px 0 0;border-top:1px solid var(--mbp-sel-ed-line)}
.mbp-sel-box--editorial .mbp-sel-links a{white-space:normal;min-height:36px}
.mbp-sel-box--editorial .mbp-sel-micro-note{margin:8px 0 0!important;font-size:12px!important;font-style:normal!important;line-height:1.6!important;text-align:left!important;color:var(--mbp-sel-ed-muted)!important}
.mbp-sel-box--editorial .mbp-sel-micro-note .mbp-aff-info{margin-block:-13px!important;vertical-align:middle}
.mbp-sel-box--editorial a:focus-visible,.mbp-sel-box--editorial summary:focus-visible{outline:2px solid var(--mbp-sel-ed-ink);outline-offset:3px}

/* Pistes repérées : volet natif fermé, sans photo ni pictogramme. */
.mbp-sel-box--editorial .mbp-sel-selected{margin:4px 0 0!important;padding:0!important;border:0!important;border-top:1px solid var(--mbp-sel-ed-line)!important;background:transparent!important}
.mbp-sel-box--editorial .mbp-sel-selected-toggle{display:block;min-height:44px;box-sizing:border-box;margin:0;padding:12px 0!important;cursor:pointer;list-style:none;font:600 13px/1.4 var(--mbp-sel-font-sans)!important;color:var(--mbp-sel-ed-muted)!important;text-decoration:none!important}
.mbp-sel-box--editorial .mbp-sel-selected-toggle::-webkit-details-marker{display:none}
.mbp-sel-box--editorial .mbp-sel-selected-toggle::after{content:"";display:inline-block;vertical-align:middle;margin-left:10px!important;width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);margin-left:2px}
.mbp-sel-box--editorial .mbp-sel-selected[open]>.mbp-sel-selected-toggle::after{transform:rotate(-135deg) translateY(-1px)}
.mbp-sel-box--editorial .mbp-sel-selected-items{margin:0!important}
.mbp-sel-box--editorial .mbp-sel-selected .mbp-sel-card{grid-template-columns:minmax(0,1fr)}
.mbp-sel-box--editorial .mbp-sel-selected .mbp-sel-actions{grid-column:1}

/* Carte unique : photo plus grande, réserve visible, un seul bouton plein. */
.mbp-sel-box--single .mbp-sel-card{grid-template-columns:96px minmax(0,1fr);border-bottom:0!important;padding-bottom:4px!important}
.mbp-sel-box--single .mbp-sel-media{width:96px!important;height:96px!important}
.mbp-sel-box.mbp-sel-box--single.mbp-sel-box--editorial .mbp-sel-name.mbp-sel-name{font:500 19px/1.3 var(--mbp-sel-font-serif)!important}
.mbp-sel-box--single .mbp-sel-actions{grid-column:1 / -1}

@container mbp-selection (min-width:540px){
 .mbp-sel-box.mbp-sel-box--editorial .mbp-sel-title.mbp-sel-title{font-size:24px!important}
 .mbp-sel-box--editorial .mbp-sel-card{grid-template-columns:64px minmax(0,1fr) auto;column-gap:18px;align-items:center;padding:14px 0!important}
 .mbp-sel-box--editorial .mbp-sel-media{width:64px!important;height:64px!important}
 .mbp-sel-box--editorial .mbp-sel-actions{grid-column:auto;flex-direction:column;align-items:flex-end;gap:2px;margin:0!important}
 .mbp-sel-box--editorial .mbp-sel-story{min-height:32px}
 .mbp-sel-box--editorial .mbp-sel-selected .mbp-sel-card{grid-template-columns:minmax(0,1fr) auto}
 .mbp-sel-box--editorial .mbp-sel-selected .mbp-sel-actions{grid-column:auto}
 .mbp-sel-box--single .mbp-sel-card{grid-template-columns:140px minmax(0,1fr);column-gap:20px;align-items:start}
 .mbp-sel-box--single .mbp-sel-media{width:140px!important;height:105px!important}
 .mbp-sel-box.mbp-sel-box--single.mbp-sel-box--editorial .mbp-sel-name.mbp-sel-name{font-size:21px!important}
 .mbp-sel-box--single .mbp-sel-actions{grid-column:2;flex-direction:row;align-items:center;gap:0 18px;margin-top:12px!important}
}
[id^="mbp-story-"]{scroll-margin-top:120px}

/* Explicit supplier offers share the existing responsive recap, no new runtime. */
.mbp-sel-offers { display: flex; flex-direction: column; gap: 8px; min-width: 0; max-width: 100%; }
.mbp-sel-offers p { margin: 0; overflow-wrap: anywhere; }
.mbp-sel-offers .mbp-sel-cta { min-height: 44px; white-space: normal !important; overflow-wrap: anywhere; box-sizing: border-box; text-align: center; }
.mbp-sel-offer[data-mbp-role="alternative"] { background: transparent !important; color: var(--mbp-color-accent, #1e6b45) !important; border: 1px solid currentColor !important; }
.mbp-sel-need { font-weight: 600; font-size: .92em; }
.mbp-sel-offer-detail { font-size: .85em; line-height: 1.5; }
.mbp-sel-box[data-mbp-purpose="guide"] .mbp-sel-grid { display: flex; flex-direction: column; }
.mbp-sel-box[data-mbp-purpose="address"] .mbp-sel-grid { display: block; }
@media(max-width: 600px) {
 .mbp-sel-offers { width: 100%; }
 .mbp-sel-offers .mbp-sel-offer { width: 100%; }
}
@container mbp-selection (min-width: 601px) {
 .mbp-sel-box--editorial .mbp-sel-card--offers { grid-template-columns: 64px minmax(0,1fr) minmax(240px,.9fr); align-items: start; }
}
.mbp-sel-card--offers .mbp-sel-actions { gap: 10px; }