/**
 * UX-02J — Panneau décoratif musical visible (correction réelle).
 * Neutralise UX-02H/I (voiles globaux, opacités faibles).
 * Panneau latéral droit desktop / bande supérieure mobile.
 */

/* ============================================================
   Cartes — zone texte gauche + panneau image droit
   ============================================================ */

body.page-id-408 .cdm-universe--musique #cdmu-member-musicality-card,
body.page-id-408 .cdm-universe--musique .cdm-my-music-member-card {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	padding-right: 34% !important;
	background: linear-gradient(
		to right,
		rgba(255, 255, 255, 0.96) 0%,
		rgba(255, 255, 255, 0.96) 62%,
		rgba(255, 255, 255, 0.92) 100%
	) !important;
	box-shadow: 0 12px 32px rgba(11, 31, 77, 0.11) !important;
	border-color: rgba(106, 63, 181, 0.12) !important;
}

/* Panneau décoratif — bande latérale droite (~30 %) */
body.page-id-408 .cdm-universe--musique #cdmu-member-musicality-card::before,
body.page-id-408 .cdm-universe--musique .cdm-my-music-member-card::before {
	content: "";
	position: absolute;
	top: 12px;
	right: 12px;
	bottom: 12px;
	width: 30%;
	min-width: 148px;
	max-width: 280px;
	height: auto;
	inset: auto;
	transform: none;
	border-radius: 20px 16px 16px 20px;
	background:
		linear-gradient(
			165deg,
			rgba(255, 255, 255, 0.22) 0%,
			rgba(255, 255, 255, 0.3) 100%
		),
		var(--cdm-bg-musique) no-repeat center / cover;
	opacity: 0.78;
	pointer-events: none;
	z-index: 0;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
}

/* Fusion douce panneau ↔ zone texte — pas de voile global */
body.page-id-408 .cdm-universe--musique #cdmu-member-musicality-card::after,
body.page-id-408 .cdm-universe--musique .cdm-my-music-member-card::after {
	content: "";
	position: absolute;
	top: 12px;
	bottom: 12px;
	right: calc(30% + 4px);
	width: 72px;
	max-width: 18%;
	background: linear-gradient(
		to right,
		rgba(255, 255, 255, 0.96) 0%,
		rgba(255, 255, 255, 0.55) 55%,
		rgba(255, 255, 255, 0) 100%
	);
	pointer-events: none;
	z-index: 1;
}

body.page-id-408 .cdm-universe--musique #cdmu-member-musicality-card > *,
body.page-id-408 .cdm-universe--musique .cdm-my-music-member-card > * {
	position: relative;
	z-index: 2;
	max-width: 100%;
}

/* ============================================================
   Neutralisation UX-02H/I — fonds internes + voiles
   ============================================================ */

body.page-id-408 .cdm-universe--musique #cdmu-member-musicality-card .cdm-card__head,
body.page-id-408 .cdm-universe--musique .cdm-my-music-member-card .cdm-card__head,
body.page-id-408 .cdm-universe--musique .cdm-my-music-member-card .cdm-my-music-member-card__stat,
body.page-id-408 .cdm-universe--musique .cdm-my-music-member-card .cdm-row,
body.page-id-408 .cdm-universe--musique #cdmu-member-musicality-card .cd-musicality-entry-card__actions,
body.page-id-408 .cdm-universe--musique #cdmu-member-musicality-card .cd-musicality-entry-card__note {
	background: transparent !important;
	backdrop-filter: none !important;
	margin-left: 0;
	max-width: 100%;
}

body.page-id-408 .cdm-universe--musique #cdmu-member-musicality-card .cd-musicality-entry-card__actions {
	padding: 4px 0 0;
	margin: 0;
	border-radius: 0;
}

body.page-id-408 .cdm-universe--musique #cdmu-member-musicality-card .cd-musicality-entry-card__note {
	padding: 8px 0 0;
	margin-top: 10px;
}

/* Badge Musicalité — lisible, hors panneau */
body.page-id-408 .cdm-universe--musique #cdmu-member-musicality-card .cd-musicality-entry-card__badge {
	z-index: 1;
	opacity: 0.12;
	right: 36%;
}

body.page-id-408 .cdm-universe--musique #cdmu-member-musicality-card .cdm-card__head .cdm-pill,
body.page-id-408 .cdm-universe--musique #cdmu-member-musicality-card .cd-musicality-entry-card__pill,
body.page-id-408 .cdm-universe--musique .cdm-my-music-member-card .cdm-pill {
	position: relative;
	z-index: 4;
	background: rgba(255, 255, 255, 0.96) !important;
	box-shadow: 0 2px 10px rgba(11, 31, 77, 0.08);
}

/* ============================================================
   Section Musique — voile allégé (UX-02G/I neutralisé)
   ============================================================ */

body.page-id-408 .cdm-universe--musique::before {
	opacity: 0.62 !important;
}

body.page-id-408 .cdm-universe--musique::after {
	background: linear-gradient(
		135deg,
		rgba(255, 255, 255, 0.28) 0%,
		rgba(244, 246, 248, 0.24) 55%,
		rgba(255, 255, 255, 0.32) 100%
	) !important;
}

body.page-id-408 .cdm-universe--musique .cdm-universe__grid .cdm-card:not(#cdmu-member-musicality-card):not(.cdm-my-music-member-card),
body.page-id-408 .cdm-universe--musique .cdm-universe__grid .csr-member-card {
	background: rgba(255, 255, 255, 0.94) !important;
}

/* ============================================================
   Mobile — bande supérieure ~120 px
   ============================================================ */

@media (max-width: 920px) {
	body.page-id-408 .cdm-universe--musique #cdmu-member-musicality-card,
	body.page-id-408 .cdm-universe--musique .cdm-my-music-member-card {
		padding-right: 16px !important;
		padding-top: 124px !important;
		background: rgba(255, 255, 255, 0.96) !important;
	}

	body.page-id-408 .cdm-universe--musique #cdmu-member-musicality-card::before,
	body.page-id-408 .cdm-universe--musique .cdm-my-music-member-card::before {
		top: 0;
		right: 0;
		left: 0;
		bottom: auto;
		width: 100%;
		max-width: none;
		min-width: 0;
		height: 120px;
		border-radius: 14px 14px 22px 22px;
		opacity: 0.72;
		background:
			linear-gradient(
				180deg,
				rgba(255, 255, 255, 0.18) 0%,
				rgba(255, 255, 255, 0.28) 100%
			),
			var(--cdm-bg-musique) no-repeat center / cover;
	}

	body.page-id-408 .cdm-universe--musique #cdmu-member-musicality-card::after,
	body.page-id-408 .cdm-universe--musique .cdm-my-music-member-card::after {
		top: 108px;
		right: 0;
		left: 0;
		bottom: auto;
		width: 100%;
		max-width: none;
		height: 36px;
		background: linear-gradient(
			to bottom,
			rgba(255, 255, 255, 0.96) 0%,
			rgba(255, 255, 255, 0) 100%
		);
	}

	body.page-id-408 .cdm-universe--musique #cdmu-member-musicality-card .cd-musicality-entry-card__badge {
		right: 8%;
		top: 42%;
		opacity: 0.1;
	}

	body.page-id-408 .cdm-universe--musique::before {
		opacity: 0.48 !important;
	}
}