/** Shopify CDN: Minification failed

Line 131:242 Unexpected "{"

**/
/* Dropdown (accordéon) — mm-dropdown-item  -------------------- */
/* <details>/<summary> natif : donner le même dropdown_name à plusieurs items
   pour qu'un seul reste ouvert à la fois. script.js anime la hauteur en douceur
   au clic (Web Animations API) ; sans JS, le natif reste utilisable (instantané).
   Deux habillages visuels au choix via le paramètre dropdown_style du snippet :
   mm-dropdown-style-1 (carte pilule ambrée — FAQ) et mm-dropdown-style-2
   (minimal, bordure basse — page produit / footer). Le comportement ci-dessous
   (collapse, toggle +/−) est commun aux deux. */

.mm-dropdown-item summary { list-style: none; }
.mm-dropdown-item summary::-webkit-details-marker { display: none; }

/* Collapse natif à l'état fermé (fallback sans JS / SEO) : script.js anime déjà la
   hauteur du <details> lui-même via WAAPI quand JS est actif, donc ::details-content
   doit rester "auto" pendant que c'est ouvert/en cours d'ouverture pour ne pas
   re-clipper le contenu. Ne pas retirer le collapse à l'état fermé : sinon
   ::details-content ne revient plus à 0 une fois [open] retiré en fin de fermeture,
   et la hauteur "auto" réelle redevient plus grande que celle animée → petit saut
   visible juste après la fermeture. */
.mm-dropdown-item::details-content { block-size: 0; overflow: hidden; }
.mm-dropdown-item[open]::details-content { block-size: auto; overflow: visible; }

.mm-dropdown-q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--mm-space-7, 24px);
	width: 100%;
	cursor: pointer;
}
.mm-dropdown-q > * { pointer-events: none; }
.mm-dropdown-q h1, .mm-dropdown-q h2, .mm-dropdown-q h3, .mm-dropdown-q h4, .mm-dropdown-q h5, .mm-dropdown-q h6, .mm-dropdown-q p {
	margin: 0;
	flex: 1;
}

/* Pastille +/− : les deux icônes se croisent en fondu + rotation à l'ouverture,
   taille/couleur/fond pilotés par le style (voir plus bas). */
.mm-dropdown-toggle {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
}
.mm-dropdown-item:not([open]) .mm-dropdown-q:hover .mm-dropdown-toggle,
.mm-dropdown-item.is-closing .mm-dropdown-q:hover .mm-dropdown-toggle {
	transform: scale(1.08) rotate(90deg);
}
.mm-dropdown-item[open]:not(.is-closing) .mm-dropdown-q:hover .mm-dropdown-toggle {
	transform: scale(1.08) rotate(180deg);
	transition: transform .6s var(--mm-curve-big, cubic-bezier(.3, 1.9, .44, 1));
}

/* Les deux icônes restent affichées en permanence (display:flex) : le fondu croisé
   entre + et − est géré via opacity ci-dessous, et un display:none ne peut pas s'animer. */
.mm-dropdown-item .mm-dropdown-toggle .mm-icon-plus,
.mm-dropdown-item .mm-dropdown-toggle .mm-icon-minus {
	display: flex;
}
.mm-dropdown-toggle .mm-icon-plus,
.mm-dropdown-toggle .mm-icon-minus {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(0deg);
	transition:
		opacity var(--mm-duration-fast, .18s) var(--mm-curve-out, ease),
		transform var(--mm-duration-medium, .38s) var(--mm-curve-big, cubic-bezier(.3, 1.9, .44, 1));
}
.mm-dropdown-toggle .mm-icon-minus { opacity: 0; transform: translate(-50%, -50%) rotate(-180deg); }
/* :not(.is-closing) — script.js retire cette classe dès le clic de fermeture, avant
   même que la hauteur ait fini de se réduire : l'icône repart tout de suite au lieu
   d'attendre la fin de l'animation (sinon elle restait décalée par rapport au panneau). */
.mm-dropdown-item[open]:not(.is-closing) .mm-dropdown-toggle .mm-icon-plus { opacity: 0; transform: translate(-50%, -50%) rotate(180deg); }
.mm-dropdown-item[open]:not(.is-closing) .mm-dropdown-toggle .mm-icon-minus { opacity: 1; transform: translate(-50%, -50%) rotate(0deg); }

/* ==========================================================================
   Style 1 — carte pilule ambrée (FAQ)
   ========================================================================== */

.mm-dropdown-style-1 {
	border: 1.5px solid var(--mm-color-secondary-light, #fdeac3);
	border-radius: 30px;
	background: var(--mm-color-white, #ffffff);
	overflow: hidden;
	transition: border-color var(--mm-duration-medium, .38s) var(--mm-curve-out, ease);
}
.mm-dropdown-style-1[open]:not(.is-closing) { border-color: var(--mm-color-secondary, #fab650); }
.mm-dropdown-style-1:hover { border-color: var(--mm-color-secondary, #fab650); }

.mm-dropdown-style-1 .mm-dropdown-q {
	padding: var(--mm-space-3, 10px) var(--mm-space-3, 10px) var(--mm-space-3, 10px) var(--mm-space-7, 24px);
}
.mm-dropdown-style-1 .mm-dropdown-q h1, .mm-dropdown-style-1 .mm-dropdown-q h2, .mm-dropdown-style-1 .mm-dropdown-q h3, .mm-dropdown-style-1 .mm-dropdown-q h4, .mm-dropdown-style-1 .mm-dropdown-q h5, .mm-dropdown-style-1 .mm-dropdown-q h6, .mm-dropdown-style-1 .mm-dropdown-q p {
	font: var(--mm-font-weight-medium, 500) var(--mm-font-size-text-lg, 18.4px) / 1.3 var(--mm-font); letter-spacing: -0.26px;
	color: var(--mm-color-secondary-dark, #df8806);
}

.mm-dropdown-style-1 .mm-dropdown-toggle {
	width: 40px;
	height: 40px;
	border-radius: var(--mm-radius-full, 1000px);
	background: var(--mm-color-secondary, #fab650);
	transition: transform var(--mm-duration-medium, .38s) var(--mm-curve-big, cubic-bezier(.3, 1.9, .44, 1));
}
.mm-dropdown-style-1 .mm-dropdown-toggle .mm-icon-plus,
.mm-dropdown-style-1 .mm-dropdown-toggle .mm-icon-minus {
	color: var(--mm-color-white, #ffffff);
}

.mm-dropdown-style-1 .mm-dropdown-answer {
	padding: 0 var(--mm-space-7, 24px) var(--mm-space-7, 24px);
}
.mm-dropdown-style-1 .mm-dropdown-answer p {
	margin: 0 0 var(--mm-space-2, 6px);
	font: 400 var(--mm-font-size-text, 15.8px) / 1.26 var(--mm-font);
	letter-spacing: -0.024em;
	color: var(--mm-color-black-700, #4a4540);
}
.mm-dropdown-style-1 .mm-dropdown-answer p:last-child { margin-bottom: 0; }

@media (max-width: 749px) {
	.mm-dropdown-style-1 { border-radius: var(--mm-radius-xxl, 24px); }
	.mm-dropdown-style-1 .mm-dropdown-q p { font-size: var(--mm-font-size-text-xs, 13.2px); }
	.mm-dropdown-style-1 .mm-dropdown-q h1, .mm-dropdown-style-1 .mm-dropdown-q h2, .mm-dropdown-style-1 .mm-dropdown-q h3, .mm-dropdown-style-1 .mm-dropdown-q h4, .mm-dropdown-style-1 .mm-dropdown-q h5, .mm-dropdown-style-1 .mm-dropdown-q h6,  {
		font-size: var(--mm-font-size-text-xs, 13.2px);
		letter-spacing: -0.02em;
	}
	.mm-dropdown-style-1 .mm-dropdown-toggle { width: 30px; height: 30px; }
	.mm-dropdown-style-1 .mm-dropdown-answer { padding: 0 var(--mm-space-3, 10px) var(--mm-space-7, 24px) var(--mm-space-7, 24px); }
	.mm-dropdown-style-1 .mm-dropdown-answer p { font-size: var(--mm-font-size-text-xs, 13.2px); line-height: 1.28; }
}

/* ==========================================================================
   Style 2 — minimal, bordure basse (page produit / footer)
   ========================================================================== */

.mm-dropdown-style-2 {
	border: none;
	border-radius: 0;
	background: transparent;
	border-bottom: 1px solid var(--mm-color-black-200, #e7e5e4);
	padding-bottom: var(--mm-space-5, 16px);
	transition: border-color var(--mm-duration-medium, .38s) var(--mm-curve-out, ease);
}
.mm-dropdown-style-2:last-child {
	border-bottom: none;
	padding-bottom: 0;
}
.mm-dropdown-style-2:hover,
.mm-dropdown-style-2[open]:not(.is-closing) {
	border-color: var(--mm-color-black-200, #e7e5e4);
}

.mm-dropdown-style-2 .mm-dropdown-q {
	color: var(--mm-color-black-900, #100f0e);
}

.mm-dropdown-style-2 .mm-dropdown-toggle {
	width: 14px;
	height: 14px;
	background: transparent;
}
.mm-dropdown-style-2 .mm-dropdown-toggle .mm-icon-plus,
.mm-dropdown-style-2 .mm-dropdown-toggle .mm-icon-minus {
	color: var(--mm-color-black-500, #99918a);
}

.mm-dropdown-style-2 .mm-dropdown-answer {
	padding: 0;
}
.mm-dropdown-style-2 .mm-dropdown-answer > * {
	padding-top: var(--mm-space-5, 16px);
}
.mm-dropdown-style-2 .mm-dropdown-answer p {
	margin: 0;
	font: var(--mm-font-weight-regular, 400) var(--mm-font-size-text-sm, 14.4px) / 1.3 var(--mm-font);
	letter-spacing: -0.26px;
}
