/* ==========================================================================
   Signalement des contenus manquants / provisoires (PRÉPRODUCTION UNIQUEMENT)
   Voir inc/manquants.php — désactivable par l'option brabois_signal_manquants.
   Tout est dessiné dans #bxm-layer : aucune règle ne touche le site lui-même.
   ========================================================================== */

:root {
	--bxm-jaune: #F6B83B;
	--bxm-jaune-voile: rgba(246, 184, 59, .22);
	--bxm-encre: #3F5565;
}

#bxm-layer {
	position: absolute;
	inset: 0 auto auto 0;
	width: 100%;
	height: 0;
	z-index: 9990;
	pointer-events: none;
}

/* Le menu plein écran et la modale de choix passent devant les repères. */
html.bh-menu-open #bxm-layer,
html.brabois-evtc-open #bxm-layer { display: none; }

/* --- Cadre posé sur un bloc incomplet ---------------------------------- */
.bxm-zone {
	position: absolute;
	box-sizing: border-box;
	border: 2px dashed var(--bxm-jaune);
	border-radius: 6px;
	background: var(--bxm-jaune-voile);
}

/* --- Étiquette « ce qui manque » --------------------------------------- */
.bxm-tag {
	position: absolute;
	box-sizing: border-box;
	max-width: min(560px, 92vw);
	padding: 9px 14px;
	border-radius: 4px;
	background: var(--bxm-jaune);
	color: var(--bxm-encre);
	font-family: Montserrat, system-ui, sans-serif;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.45;
	letter-spacing: .02em;
	text-align: left;
	box-shadow: 0 3px 10px rgba(0, 0, 0, .22);
}

.bxm-tag b {
	display: block;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: .08em;
}

.bxm-tag span {
	display: block;
	margin-top: 3px;
	font-weight: 500;
	font-family: Geist, system-ui, sans-serif;
	font-size: 12.5px;
}

/* --- Bandeau récapitulatif --------------------------------------------- */
#bxm-recap {
	position: fixed;
	right: 16px;
	bottom: 16px;
	z-index: 9995;
	width: min(360px, calc(100vw - 32px));
	max-height: min(70vh, 620px);
	display: flex;
	flex-direction: column;
	border: 2px solid var(--bxm-jaune);
	border-radius: 10px;
	background: #FFFCF5;
	box-shadow: 0 10px 32px rgba(0, 0, 0, .28);
	font-family: Geist, system-ui, sans-serif;
	color: var(--bxm-encre);
	overflow: hidden;
}

#bxm-recap[hidden] { display: none; }

.bxm-recap__head {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 14px;
	background: var(--bxm-jaune);
	font-family: Montserrat, system-ui, sans-serif;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
	border: 0;
	width: 100%;
	text-align: left;
	color: var(--bxm-encre);
}

.bxm-recap__count {
	margin-left: auto;
	padding: 2px 9px;
	border-radius: 999px;
	background: var(--bxm-encre);
	color: #FFFCF5;
	font-size: 12px;
}

.bxm-recap__body {
	padding: 6px 14px 14px;
	overflow-y: auto;
	font-size: 13px;
	line-height: 1.5;
}

#bxm-recap.is-closed .bxm-recap__body { display: none; }

.bxm-recap__body ol { margin: 8px 0 0; padding-left: 20px; }
.bxm-recap__body li { margin-bottom: 9px; }
.bxm-recap__body li b { display: block; font-family: Montserrat, system-ui, sans-serif; font-size: 12px; }
.bxm-recap__intro { margin: 10px 0 0; font-size: 12.5px; opacity: .85; }

/* --- Placeholders déjà présents dans le contenu (mentions légales, etc.) - */
.brabois-legal mark,
.brabois-infos mark,
.brabois-pratique mark {
	background: var(--bxm-jaune);
	color: var(--bxm-encre);
	padding: 1px 5px;
	border-radius: 3px;
	font-weight: 600;
}

/* --- Flèche d'activation / désactivation (lot toggle 23/09/2026) ------- */
.bxm-recap__bar { display: flex; align-items: stretch; background: var(--bxm-jaune); }
.bxm-recap__bar .bxm-recap__head { flex: 1 1 auto; min-width: 0; }
.bxm-recap__toggle {
	flex: 0 0 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-left: 1px solid rgba(63, 85, 101, .25);
	background: var(--bxm-jaune);
	color: var(--bxm-encre);
	cursor: pointer;
	padding: 0;
}
.bxm-recap__toggle:hover { background: #F2A816; }
.bxm-recap__toggle svg { transition: transform .25s ease; }

/* Désactivé : plus aucun cadre sur la page, le panneau se réduit à la flèche. */
html.bxm-off #bxm-layer { display: none; }
html.bxm-off #bxm-recap { width: auto; max-height: none; }
html.bxm-off #bxm-recap .bxm-recap__head,
html.bxm-off #bxm-recap .bxm-recap__body { display: none; }
html.bxm-off .bxm-recap__toggle { flex-basis: 44px; height: 44px; border-left: 0; }
html.bxm-off .bxm-recap__toggle svg { transform: rotate(180deg); }

@media print { #bxm-layer, #bxm-recap { display: none; } }