/* === JM - Encart à lisière — v1.0.0 === */

/* ── Conteneur principal ── */
.jmec {
	--jmec-edge-color: #C8A04A;
	--jmec-edge-thickness: 3px;
	--jmec-card-bg: #FFFFFF;
	--jmec-card-radius: 8px;
	--jmec-card-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
	--jmec-card-padding: 24px;
	--jmec-max-desktop: 660px;
	--jmec-max-mobile: 100%;

	box-sizing: border-box;
	width: 100%;
	max-width: var(--jmec-max-desktop);
}

.jmec.__centered {
	margin-left: auto;
	margin-right: auto;
}

/* ── Bloc interne : reçoit la lisière + l'habillage selon le mode ── */
.jmec .jmec__inner {
	box-sizing: border-box;
	padding: var(--jmec-card-padding);
	background: var(--jmec-card-bg);
	box-shadow: var(--jmec-card-shadow);
}

/* ── Position de la lisière + arrondi côté opposé ── */
.jmec.__edge-left .jmec__inner {
	border-left: var(--jmec-edge-thickness) solid var(--jmec-edge-color);
	border-radius: 0 var(--jmec-card-radius) var(--jmec-card-radius) 0;
}
.jmec.__edge-right .jmec__inner {
	border-right: var(--jmec-edge-thickness) solid var(--jmec-edge-color);
	border-radius: var(--jmec-card-radius) 0 0 var(--jmec-card-radius);
}
.jmec.__edge-top .jmec__inner {
	border-top: var(--jmec-edge-thickness) solid var(--jmec-edge-color);
	border-radius: 0 0 var(--jmec-card-radius) var(--jmec-card-radius);
}
.jmec.__edge-bottom .jmec__inner {
	border-bottom: var(--jmec-edge-thickness) solid var(--jmec-edge-color);
	border-radius: var(--jmec-card-radius) var(--jmec-card-radius) 0 0;
}

/* ── Mode filigrane : pas de fond / pas d'ombre, seule la lisière subsiste ── */
.jmec.__d-watermark .jmec__inner {
	background: transparent;
	box-shadow: none;
	border-radius: 0;
}

/* ── Bascules par breakpoint ──
   On répète la règle pour chaque breakpoint pris en charge ; seule celle
   dont la classe correspond s'applique. */

@media (max-width: 480px) {
	.jmec.__break-480 { max-width: var(--jmec-max-mobile); }
	.jmec.__break-480.__m-watermark .jmec__inner {
		background: transparent;
		box-shadow: none;
		border-radius: 0;
	}
	.jmec.__break-480.__m-card.__edge-left   .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: 0 var(--jmec-card-radius) var(--jmec-card-radius) 0; }
	.jmec.__break-480.__m-card.__edge-right  .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: var(--jmec-card-radius) 0 0 var(--jmec-card-radius); }
	.jmec.__break-480.__m-card.__edge-top    .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: 0 0 var(--jmec-card-radius) var(--jmec-card-radius); }
	.jmec.__break-480.__m-card.__edge-bottom .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: var(--jmec-card-radius) var(--jmec-card-radius) 0 0; }
}

@media (max-width: 680px) {
	.jmec.__break-680 { max-width: var(--jmec-max-mobile); }
	.jmec.__break-680.__m-watermark .jmec__inner {
		background: transparent;
		box-shadow: none;
		border-radius: 0;
	}
	.jmec.__break-680.__m-card.__edge-left   .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: 0 var(--jmec-card-radius) var(--jmec-card-radius) 0; }
	.jmec.__break-680.__m-card.__edge-right  .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: var(--jmec-card-radius) 0 0 var(--jmec-card-radius); }
	.jmec.__break-680.__m-card.__edge-top    .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: 0 0 var(--jmec-card-radius) var(--jmec-card-radius); }
	.jmec.__break-680.__m-card.__edge-bottom .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: var(--jmec-card-radius) var(--jmec-card-radius) 0 0; }
}

@media (max-width: 768px) {
	.jmec.__break-768 { max-width: var(--jmec-max-mobile); }
	.jmec.__break-768.__m-watermark .jmec__inner {
		background: transparent;
		box-shadow: none;
		border-radius: 0;
	}
	.jmec.__break-768.__m-card.__edge-left   .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: 0 var(--jmec-card-radius) var(--jmec-card-radius) 0; }
	.jmec.__break-768.__m-card.__edge-right  .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: var(--jmec-card-radius) 0 0 var(--jmec-card-radius); }
	.jmec.__break-768.__m-card.__edge-top    .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: 0 0 var(--jmec-card-radius) var(--jmec-card-radius); }
	.jmec.__break-768.__m-card.__edge-bottom .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: var(--jmec-card-radius) var(--jmec-card-radius) 0 0; }
}

@media (max-width: 900px) {
	.jmec.__break-900 { max-width: var(--jmec-max-mobile); }
	.jmec.__break-900.__m-watermark .jmec__inner {
		background: transparent;
		box-shadow: none;
		border-radius: 0;
	}
	.jmec.__break-900.__m-card.__edge-left   .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: 0 var(--jmec-card-radius) var(--jmec-card-radius) 0; }
	.jmec.__break-900.__m-card.__edge-right  .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: var(--jmec-card-radius) 0 0 var(--jmec-card-radius); }
	.jmec.__break-900.__m-card.__edge-top    .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: 0 0 var(--jmec-card-radius) var(--jmec-card-radius); }
	.jmec.__break-900.__m-card.__edge-bottom .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: var(--jmec-card-radius) var(--jmec-card-radius) 0 0; }
}

@media (max-width: 1024px) {
	.jmec.__break-1024 { max-width: var(--jmec-max-mobile); }
	.jmec.__break-1024.__m-watermark .jmec__inner {
		background: transparent;
		box-shadow: none;
		border-radius: 0;
	}
	.jmec.__break-1024.__m-card.__edge-left   .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: 0 var(--jmec-card-radius) var(--jmec-card-radius) 0; }
	.jmec.__break-1024.__m-card.__edge-right  .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: var(--jmec-card-radius) 0 0 var(--jmec-card-radius); }
	.jmec.__break-1024.__m-card.__edge-top    .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: 0 0 var(--jmec-card-radius) var(--jmec-card-radius); }
	.jmec.__break-1024.__m-card.__edge-bottom .jmec__inner { background: var(--jmec-card-bg); box-shadow: var(--jmec-card-shadow); border-radius: var(--jmec-card-radius) var(--jmec-card-radius) 0 0; }
}

/* ── Éditeur : neutraliser le padding par défaut du wrapper InnerBlocks ── */
.jmec .jmec__inner > .block-editor-inner-blocks,
.jmec .jmec__inner > .block-editor-inner-blocks > .block-editor-block-list__layout {
	margin: 0;
}
