/* ===================================================================
   Inter, servie par le thème (plus d'@import Google Fonts dans vendor/styles.css).

   Police variable : un fichier par jeu de caractères couvre les graisses 100 à 900.
   L'@import externe faisait découvrir le .woff2 après deux allers-retours, à chaque
   page : le premier paint d'une navigation admin sortait avant la police, titres
   invisibles puis bascule. Le fichier latin est préchargé dans le <head> admin
   (pageBuilder::getAdminFontPreloadLink), à cette même URL nue.
   =================================================================== */
@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url(../fonts/inter/inter-latin-ext.woff2) format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url(../fonts/inter/inter-latin.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/*
 * @author: Mathieu MARI <contact@mathieumari.com>
 * @date:   30-08-2025 12:50:35
 * @lastModifiedBy:   Mathieu MARI <contact@mathieumari.com>
 * @lastModifiedTime: 2026-10-13 23:15:00
 */

:root {
	/* Rend les contrôles natifs (popup <select>, scrollbars, date pickers…) en clair. */
	color-scheme: light;

	/* Pour les couleurs spécifiques du système de champs manquants mmFormV2_missingFieldsPopup. */
	--mm-popup-primary-color-start: #0089d9;
	--mm-popup-primary-color-end: #0089d9;
	--mm-popup-primary-shadow: rgba(0, 137, 217, 0.3);
	--mm-popup-primary-shadow-hover: rgba(0, 137, 217, 0.4);
	--mm-popup-primary-shadow-pulse: rgba(0, 137, 217, 0.3);
	--mm-popup-primary-shadow-pulse-active: rgba(0, 137, 217, 0.4);

	/* Scrollbar overlay — fine, reveal on hover (tables, modals, sidebar, etc.) */
	--mm-scroll-size: 4px;
	--mm-scroll-thumb: rgba(15, 23, 42, 0.14);
	--mm-scroll-thumb-hover: rgba(15, 23, 42, 0.26);
	--mm-scroll-thumb-active: rgba(15, 23, 42, 0.36);

	/* Modales — couleur d'extrémité du voile radial (recette --mm-modal-backdrop-veil dans maestra.css) */
	--mm-modal-backdrop-bg: rgba(15, 23, 42, 0.50);
	--mm-modal-backdrop-core: rgba(15, 23, 42, 0);
	--mm-modal-border: rgba(15, 23, 42, 0.06);
	--mm-modal-radius: 14px;
	--mm-modal-shadow: 0 1px 2px rgba(15, 23, 42, 0.06), 0 24px 64px -16px rgba(15, 23, 42, 0.32);

	/* Dropdowns topbar — même voile que les modales, origine au coin du panneau */
	--mm-dropdown-veil: var(--mm-modal-backdrop-bg);
	--mm-dropdown-veil-mid: var(--mm-modal-backdrop-mid);
	--mm-dropdown-veil-core: var(--mm-modal-backdrop-core);
	/* Durée du fondu — partagée par l'opacité du voile et le retour des z-index */
	--mm-dropdown-veil-fade: 0.24s;
	/* Au-dessus du menu vertical (99), des thead collants (1020), de selectize
	   (1060) et du pager (1090), sous les modales */
	--mm-dropdown-menu-z: 1181;
}

html[data-bs-theme="dark"] {
	/* Rend les contrôles natifs sombres : popup <select>, caret, scrollbars… */
	color-scheme: dark;

	--mm-scroll-thumb: rgba(226, 235, 245, 0.14);
	--mm-scroll-thumb-hover: rgba(226, 235, 245, 0.28);
	--mm-scroll-thumb-active: rgba(226, 235, 245, 0.40);

	--mm-modal-backdrop-bg: rgba(2, 6, 23, 0.64);
	--mm-modal-backdrop-core: rgba(2, 6, 23, 0);
	--mm-modal-border: rgba(255, 255, 255, 0.08);
	--mm-modal-shadow: 0 0 0 1px rgba(255, 255, 255, 0.04), 0 28px 70px -18px rgba(0, 0, 0, 0.70);
}

/* ===================================================================
   Scrollbars — overlay discret, visible au survol de la zone scrollable.
   Cible viewport (html/body), tableaux admin, modales, sidebar, etc.
   =================================================================== */
:is(
	html,
	body,
	.table-responsive,
	.table-scroll-wrapper,
	[class*="-table-wrap"],
	.scroll-sidebar,
	.message-body,
	.modal-body,
	.offcanvas-body,
	.profile-dropdown,
	.dropdown-menu,
	.selectize-dropdown-content,
	pre.mmConserveLines,
	.mm-scroll-surface,
	[data-simplebar] .simplebar-content-wrapper
) {
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
	scrollbar-color: transparent transparent;
}

:is(
	html,
	body,
	.table-responsive,
	.table-scroll-wrapper,
	[class*="-table-wrap"],
	.scroll-sidebar,
	.message-body,
	.modal-body,
	.offcanvas-body,
	.profile-dropdown,
	.dropdown-menu,
	.selectize-dropdown-content,
	pre.mmConserveLines,
	.mm-scroll-surface,
	[data-simplebar] .simplebar-content-wrapper
)::-webkit-scrollbar {
	width: var(--mm-scroll-size);
	height: var(--mm-scroll-size);
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
}

:is(
	html,
	body,
	.table-responsive,
	.table-scroll-wrapper,
	[class*="-table-wrap"],
	.scroll-sidebar,
	.message-body,
	.modal-body,
	.offcanvas-body,
	.profile-dropdown,
	.dropdown-menu,
	.selectize-dropdown-content,
	pre.mmConserveLines,
	.mm-scroll-surface,
	[data-simplebar] .simplebar-content-wrapper
)::-webkit-scrollbar-track {
	background: transparent;
	border: 0;
}

:is(
	html,
	body,
	.table-responsive,
	.table-scroll-wrapper,
	[class*="-table-wrap"],
	.scroll-sidebar,
	.message-body,
	.modal-body,
	.offcanvas-body,
	.profile-dropdown,
	.dropdown-menu,
	.selectize-dropdown-content,
	pre.mmConserveLines,
	.mm-scroll-surface,
	[data-simplebar] .simplebar-content-wrapper
)::-webkit-scrollbar-thumb {
	background-color: transparent;
	border-radius: 999px;
	transition: background-color 0.18s ease;
}

:is(
	html,
	body,
	.table-responsive,
	.table-scroll-wrapper,
	[class*="-table-wrap"],
	.scroll-sidebar,
	.message-body,
	.modal-body,
	.offcanvas-body,
	.profile-dropdown,
	.dropdown-menu,
	.selectize-dropdown-content,
	pre.mmConserveLines,
	.mm-scroll-surface,
	[data-simplebar] .simplebar-content-wrapper
)::-webkit-scrollbar-button,
:is(
	html,
	body,
	.table-responsive,
	.table-scroll-wrapper,
	[class*="-table-wrap"],
	.scroll-sidebar,
	.message-body,
	.modal-body,
	.offcanvas-body,
	.profile-dropdown,
	.dropdown-menu,
	.selectize-dropdown-content,
	pre.mmConserveLines,
	.mm-scroll-surface,
	[data-simplebar] .simplebar-content-wrapper
)::-webkit-scrollbar-corner {
	display: none;
	width: 0;
	height: 0;
	background: transparent;
}

@media (hover: hover) {
	:is(
		html,
		body,
		.table-responsive,
		.table-scroll-wrapper,
		[class*="-table-wrap"],
		.scroll-sidebar,
		.message-body,
		.modal-body,
		.offcanvas-body,
		.profile-dropdown,
		.dropdown-menu,
		.selectize-dropdown-content,
		pre.mmConserveLines,
		.mm-scroll-surface,
		[data-simplebar] .simplebar-content-wrapper
	):is(:hover, :focus-visible, :has(:focus-visible)) {
		scrollbar-color: var(--mm-scroll-thumb) transparent;
	}

	:is(
		html,
		body,
		.table-responsive,
		.table-scroll-wrapper,
		[class*="-table-wrap"],
		.scroll-sidebar,
		.message-body,
		.modal-body,
		.offcanvas-body,
		.profile-dropdown,
		.dropdown-menu,
		.selectize-dropdown-content,
		pre.mmConserveLines,
		.mm-scroll-surface,
		[data-simplebar] .simplebar-content-wrapper
	):is(:hover, :focus-visible, :has(:focus-visible))::-webkit-scrollbar-thumb {
		background-color: var(--mm-scroll-thumb);
	}

	:is(
		html,
		body,
		.table-responsive,
		.table-scroll-wrapper,
		[class*="-table-wrap"],
		.scroll-sidebar,
		.message-body,
		.modal-body,
		.offcanvas-body,
		.profile-dropdown,
		.dropdown-menu,
		.selectize-dropdown-content,
		pre.mmConserveLines,
		.mm-scroll-surface,
		[data-simplebar] .simplebar-content-wrapper
	)::-webkit-scrollbar-thumb:hover {
		background-color: var(--mm-scroll-thumb-hover);
	}

	:is(
		html,
		body,
		.table-responsive,
		.table-scroll-wrapper,
		[class*="-table-wrap"],
		.scroll-sidebar,
		.message-body,
		.modal-body,
		.offcanvas-body,
		.profile-dropdown,
		.dropdown-menu,
		.selectize-dropdown-content,
		pre.mmConserveLines,
		.mm-scroll-surface,
		[data-simplebar] .simplebar-content-wrapper
	)::-webkit-scrollbar-thumb:active {
		background-color: var(--mm-scroll-thumb-active);
	}
}

@media (hover: none) {
	:is(
		html,
		body,
		.table-responsive,
		.table-scroll-wrapper,
		[class*="-table-wrap"],
		.scroll-sidebar,
		.message-body,
		.modal-body,
		.offcanvas-body,
		.profile-dropdown,
		.dropdown-menu,
		.selectize-dropdown-content,
		pre.mmConserveLines,
		.mm-scroll-surface,
		[data-simplebar] .simplebar-content-wrapper
	) {
		scrollbar-color: var(--mm-scroll-thumb) transparent;
	}

	:is(
		html,
		body,
		.table-responsive,
		.table-scroll-wrapper,
		[class*="-table-wrap"],
		.scroll-sidebar,
		.message-body,
		.modal-body,
		.offcanvas-body,
		.profile-dropdown,
		.dropdown-menu,
		.selectize-dropdown-content,
		pre.mmConserveLines,
		.mm-scroll-surface,
		[data-simplebar] .simplebar-content-wrapper
	)::-webkit-scrollbar-thumb {
		background-color: var(--mm-scroll-thumb);
	}
}

@media (prefers-reduced-motion: reduce) {
	:is(
		html,
		body,
		.table-responsive,
		.table-scroll-wrapper,
		[class*="-table-wrap"],
		.scroll-sidebar,
		.message-body,
		.modal-body,
		.offcanvas-body,
		.profile-dropdown,
		.dropdown-menu,
		.selectize-dropdown-content,
		pre.mmConserveLines,
		.mm-scroll-surface,
		[data-simplebar] .simplebar-content-wrapper
	)::-webkit-scrollbar-thumb {
		transition: none;
	}
}

/* SimpleBar — même design overlay, reveal au survol du conteneur */
[data-simplebar] .simplebar-track.simplebar-vertical {
	width: var(--mm-scroll-size);
}

[data-simplebar] .simplebar-track.simplebar-horizontal {
	height: var(--mm-scroll-size);
}

[data-simplebar] .simplebar-scrollbar:before {
	background: var(--mm-scroll-thumb);
	border-radius: 999px;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	opacity: 0;
	transition: opacity 0.18s ease, background-color 0.18s ease;
}

@media (hover: hover) {
	[data-simplebar]:is(:hover, :has(:focus-visible)) .simplebar-scrollbar:before,
	[data-simplebar] .simplebar-scrollbar.simplebar-visible:before {
		opacity: 1;
	}

	[data-simplebar]:is(:hover, :has(:focus-visible)) .simplebar-scrollbar:hover:before {
		background: var(--mm-scroll-thumb-hover);
	}

	[data-simplebar] .simplebar-scrollbar.simplebar-visible:active:before {
		background: var(--mm-scroll-thumb-active);
	}
}

@media (hover: none) {
	[data-simplebar] .simplebar-scrollbar:before {
		opacity: 1;
	}
}

/* --------------------------------------------------------------------------------------------- Selection */
/* ::selection {
	background: rgba(var(--bs-primary), 0.3);
	color: #222;
}
::-moz-selection {
	background: rgba(var(--bs-primary), 0.3);
	color: #222;
}
::-webkit-selection {
	background: rgba(var(--bs-primary), 0.3);
	color: #222;
} */

/* ===================================================================
   Tooltips — flat : surface opaque d'un cran par rapport à la carte + un
   trait de contour net. Pas d'ombre empilée, pas de dégradé, pas de blur :
   sur une carte blanche c'est la teinte qui détache le tooltip, pas la
   profondeur. Le ring passe par box-shadow, donc il ne compte pas dans la
   boîte et la flèche reste alignée sur le bord.
   Les [!important] écrasent le CSS du bundle plugin.
   =================================================================== */
.mm-tooltip {
	--tt-bg: #f1f5f9;
	--tt-fg: #0f172a;
	--tt-ring: #cbd5e1;
	--tt-arrow-size: 8px;
	position: relative;
	z-index: 99999;
	visibility: hidden;
	max-width: 320px;
	padding: 7px 11px !important;
	min-height: 0 !important;
	border: 0 !important;
	border-radius: 8px;
	background: var(--tt-bg) !important;
	color: var(--tt-fg) !important;
	box-shadow:
		0 0 0 1px var(--tt-ring),
		0 1px 2px rgba(15, 23, 42, 0.08) !important;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: -0.006em;
	text-wrap: balance;
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
	pointer-events: none;
	-webkit-font-smoothing: antialiased;
	animation: mmTooltipIn 90ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

/* Survol enchaîné d'une ancre à l'autre : le tooltip suivant apparaît sans entrée. */
.mm-tooltip.is-instant {
	animation: none;
}

/* En dark une surface s'élève en s'éclaircissant : l'ombre ne se voit pas. */
html[data-bs-theme="dark"] .mm-tooltip {
	--tt-bg: #222c33;
	--tt-fg: #f8fafc;
	--tt-ring: #3c4a52;
	box-shadow:
		0 0 0 1px var(--tt-ring),
		0 1px 2px rgba(0, 0, 0, 0.45) !important;
}

/* Flèche : carré tourné à 45° portant le ring sur ses deux bords extérieurs.
   Un triangle en border ne peut pas porter de liseré. [rotate] est une
   propriété à part : le translate de Popper sur le tooltip reste intact. */
.mm-tooltip::after {
	content: '';
	position: absolute;
	width: var(--tt-arrow-size) !important;
	height: var(--tt-arrow-size) !important;
	background: var(--tt-bg) !important;
	border-style: solid !important;
	border-width: 1px !important;
	border-radius: 2px;
	rotate: 45deg;
	pointer-events: none;
}

.mm-tooltip::before {
	content: none;
	display: none;
}

.mm-tooltip[data-popper-placement^='bottom'] {
	--tt-from-y: -3px;
}
.mm-tooltip[data-popper-placement^='bottom']::after {
	top: calc(var(--tt-arrow-size) / -2);
	left: 50%;
	transform: translateX(-50%);
	border-color: var(--tt-ring) transparent transparent var(--tt-ring) !important;
}

.mm-tooltip[data-popper-placement^='top'] {
	--tt-from-y: 3px;
}
.mm-tooltip[data-popper-placement^='top']::after {
	bottom: calc(var(--tt-arrow-size) / -2);
	left: 50%;
	transform: translateX(-50%);
	border-color: transparent var(--tt-ring) var(--tt-ring) transparent !important;
}

.mm-tooltip[data-popper-placement^='left'] {
	--tt-from-x: 3px;
	--tt-from-y: 0;
}
.mm-tooltip[data-popper-placement^='left']::after {
	right: calc(var(--tt-arrow-size) / -2);
	top: 50%;
	transform: translateY(-50%);
	border-color: var(--tt-ring) var(--tt-ring) transparent transparent !important;
}

.mm-tooltip[data-popper-placement^='right'] {
	--tt-from-x: -3px;
	--tt-from-y: 0;
}
.mm-tooltip[data-popper-placement^='right']::after {
	left: calc(var(--tt-arrow-size) / -2);
	top: 50%;
	transform: translateY(-50%);
	border-color: transparent transparent var(--tt-ring) var(--tt-ring) !important;
}

/*
   Le tooltip sort de son ancre : fondu court + quelques px dans l'axe du
   placement. Pas de flou : le texte doit être lisible dès la première frame.
   [translate] et pas [scale] : les transformations individuelles sont composées
   avec le [transform] de Popper, donc un scale multiplierait aussi son
   translate(x, y) et ferait dériver le tooltip en diagonale. Un translate
   individuel, lui, s'additionne simplement au sien.
*/
@keyframes mmTooltipIn {
	from {
		opacity: 0.4;
		translate: var(--tt-from-x, 0) var(--tt-from-y, -3px);
	}
	to {
		opacity: 1;
		translate: 0 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mm-tooltip {
		animation: none;
	}
}

.mm-tooltip .arrow {
	display: none !important;
}

/* --------------------------------------------------------------------------------------------- Permet aux boutons dans les tableaux de ne pas bouger au survole avec les tooltips */
.action-btn .mm-tooltip {
	position: fixed !important;
	display: block !important;
	width: auto !important;
	height: auto !important;
	left: 0 !important;
	top: 0 !important;
	z-index: 9999;
}

/* éviter que ça casse le flex/inline */
.action-btn {
	display: inline-flex;
	align-items: center;
}

/* Dernière colonne centrée : [.search-table] retire le padding droit pour coller au bord du tableau,
   ce qui décalerait le contenu centré d'un demi-padding. On rend l'espacement symétrique. */
.search-table tr > :is(th, td).text-center:last-child {
	padding-right: 24px;
}

/* Première colonne checkbox : case centrée, toute la cellule cliquable.
   Le thème pose padding-left:0 sur le 1er enfant, et [.form-check] réserve 1.5em
   à gauche pour un label : sans ça, la case se colle à gauche. */
.search-table tr > :is(th, td):first-child:has(input[type="checkbox"]) {
	position: relative;
	width: 3.5rem;
	min-width: 3.5rem;
	max-width: 3.5rem;
	padding: 0;
	text-align: center;
	vertical-align: middle;
	user-select: none;
}

.search-table tr > :is(th, td):first-child:has(input[type="checkbox"]) .n-chk,
.search-table tr > :is(th, td):first-child:has(input[type="checkbox"]) .form-check {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 0;
	min-height: 0;
	width: auto;
	cursor: pointer;
}

.search-table tr > :is(th, td):first-child:has(input[type="checkbox"]) .form-check-label {
	position: absolute;
	inset: 0;
	margin: 0;
	padding: 0;
	cursor: pointer;
}

.search-table tr > :is(th, td):first-child:has(input[type="checkbox"]) .form-check-input {
	float: none;
	margin: 0;
	position: relative;
	z-index: 1;
	cursor: pointer;
}

.search-table tr > :is(th, td):first-child:has(input[type="checkbox"]) .new-control-indicator {
	display: none;
}

/* --------------------------------------------------------------------------------------------- Actions de ligne de tableau — slots 36px de largeur fixe, alignés à droite */
/* Un emplacement reste occupé même quand l'action n'est pas disponible (.is-off) : les icônes
   d'une colonne Actions tombent donc toujours sur les mêmes axes d'une ligne à l'autre. */
.mm-row-actions {
	display: inline-flex;
	align-items: center;
	justify-content: flex-end;
	gap: 0.3rem;
}

.mm-row-action {
	position: relative;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	text-decoration: none;
	transition: background-color 0.15s ease;
}

.mm-row-action:hover {
	background-color: var(--bs-primary-bg-subtle);
}

.mm-row-action.text-danger:hover,
.mm-row-action.is-blocked:hover {
	background-color: var(--bs-danger-bg-subtle);
}

.mm-row-action.text-warning:hover {
	background-color: var(--bs-warning-bg-subtle);
}

.mm-row-action.is-off {
	color: var(--bs-secondary-color, #6c757d);
	opacity: 0.22;
	cursor: default;
}

.mm-row-action.is-off:hover {
	background-color: transparent;
}

/* --------------------------------------------------------------------------------------------- Menu d'actions d'une ligne (bouton ⋮) */
/* Même langage visuel que le menu contextuel du plugin contact : panneau arrondi posé sur la page,
   en-tête qui rappelle sur qui on agit, icônes en gris qui passent à l'accent au survol. */
.mm-row-menu {
	--mm-row-menu-bg: #fff;
	--mm-row-menu-fg: #141a22;
	--mm-row-menu-dim: #5c6a7a;
	--mm-row-menu-bd: rgba(20, 26, 34, 0.09);
	--mm-row-menu-hover: rgba(59, 130, 246, 0.1);
	--mm-row-menu-accent: #2563eb;
}

html[data-bs-theme="dark"] .mm-row-menu {
	--mm-row-menu-bg: #1a222d;
	--mm-row-menu-fg: #eef2f7;
	--mm-row-menu-dim: #8b9aad;
	--mm-row-menu-bd: rgba(255, 255, 255, 0.1);
	--mm-row-menu-hover: rgba(96, 165, 250, 0.14);
	--mm-row-menu-accent: #60a5fa;
}

.mm-row-menu__toggle[aria-expanded="true"] {
	background-color: var(--mm-row-menu-hover);
	color: var(--mm-row-menu-accent);
}

.mm-row-menu__list.dropdown-menu {
	min-width: 13.75rem;
	padding: 0.3rem;
	border-radius: 14px;
	background: var(--mm-row-menu-bg);
	border: 1px solid var(--mm-row-menu-bd);
	box-shadow: 0 12px 40px rgba(15, 23, 42, 0.16), 0 0 0 1px rgba(20, 26, 34, 0.04);
	z-index: 1181;
}

html[data-bs-theme="dark"] .mm-row-menu__list.dropdown-menu {
	box-shadow: 0 18px 48px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.04);
}

/* Opacité seulement : Popper positionne le menu avec un [transform], l'animer le déplacerait. */
.mm-row-menu__list.dropdown-menu.show {
	animation: mmRowMenuIn 0.14s ease-out;
}

@keyframes mmRowMenuIn {
	from {
		opacity: 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mm-row-menu__list.dropdown-menu.show {
		animation: none;
	}
}

.mm-row-menu__head {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.45rem 0.6rem 0.55rem;
	margin-bottom: 0.2rem;
	border-bottom: 1px solid var(--mm-row-menu-bd);
}

.mm-row-menu__avatar {
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: #fff;
}

.mm-avatar--admin,
.mm-row-menu__avatar.mm-avatar--admin {
	box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.72);
}

.mm-row-menu__identity {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.mm-row-menu__name,
.mm-row-menu__meta {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 11rem;
}

.mm-row-menu__name {
	font-size: 0.82rem;
	font-weight: 600;
	line-height: 1.25;
	color: var(--mm-row-menu-fg);
}

.mm-row-menu__meta {
	font-size: 0.72rem;
	line-height: 1.3;
	color: var(--mm-row-menu-dim);
}

/* Filet entre les actions courantes et l'action destructrice. */
.mm-row-menu__sep {
	height: 1px;
	margin: 0.3rem 0.4rem;
	background: var(--mm-row-menu-bd);
	list-style: none;
}

.mm-row-menu__item.dropdown-item {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	padding: 0.55rem 0.65rem;
	border-radius: 10px;
	font-size: 0.8125rem;
	font-weight: 500;
	line-height: 1.3;
	color: var(--mm-row-menu-fg);
}

button.mm-row-menu__item.dropdown-item {
	width: 100%;
	border: 0;
	background: transparent;
	font: inherit;
	text-align: left;
	cursor: pointer;
}

.mm-row-menu__item.dropdown-item i {
	flex-shrink: 0;
	width: 1.1rem;
	font-size: 1.05rem;
	text-align: center;
	color: var(--mm-row-menu-dim);
	transition: color 0.12s ease;
}

.mm-row-menu__item.dropdown-item:hover,
.mm-row-menu__item.dropdown-item:focus,
.mm-row-menu__item.dropdown-item:active {
	background-color: var(--mm-row-menu-hover);
	color: var(--mm-row-menu-fg);
}

.mm-row-menu__item.dropdown-item:hover i,
.mm-row-menu__item.dropdown-item:focus i {
	color: var(--mm-row-menu-accent);
}

.mm-row-menu__item--danger.dropdown-item {
	--mm-row-menu-hover: rgba(220, 38, 38, 0.1);
	--mm-row-menu-accent: #dc2626;
	color: #dc2626;
}

html[data-bs-theme="dark"] .mm-row-menu__item--danger.dropdown-item {
	--mm-row-menu-hover: rgba(248, 113, 113, 0.14);
	--mm-row-menu-accent: #f87171;
	color: #f87171;
}

.mm-row-menu__item--danger.dropdown-item i {
	color: inherit;
}

.mm-row-menu__item--danger.dropdown-item:hover,
.mm-row-menu__item--danger.dropdown-item:focus,
.mm-row-menu__item--danger.dropdown-item:active {
	color: var(--mm-row-menu-accent);
}

/* --------------------------------------------------------------------------------------------- Dernière connexion — seconde ligne sous la date d'inscription */
/* Même écriture que les autres cellules à deux niveaux du thème : la valeur, puis une ligne
   .text-muted.fs-2. Seule la pastille Tabler porte la fraîcheur, et elle prend les couleurs
   sémantiques Bootstrap : les 6 palettes du thème et le mode sombre suivent sans surcharge. */
.mm-lastseen {
	display: flex;
	align-items: center;
	gap: 2px;
	line-height: 1.4;
}

.mm-lastseen i {
	flex-shrink: 0;
	color: var(--bs-gray-500);
	font-size: 0.875rem;
	line-height: 1;
}

.mm-lastseen--fresh i {
	color: var(--bs-success);
}

.mm-lastseen--recent i {
	color: var(--bs-warning);
}

.page-wrapper {
	width: 100%;
	transition: none !important;
	overflow-x: hidden;
}

/* --- Filigrane : grand logo Maestra en bas à droite, en fondu, sur toutes les pages admin
   (même geste que les pages d'erreur, errorPage::buildMark). Le .body-wrapper, positionné
   sans z-index (donc sans contexte d'empilement : les modales gardent le leur), est peint
   après lui : cartes et tableaux le couvrent, il ne se voit que dans les marges.
   Pas de z-index négatif : un fond opaque de la pile le masquait.
   Aucune animation d'entrée : rejouée à chaque page, elle effaçait le logo puis le
   ramenait en fondu, un clignotement à chaque navigation. */
.page-wrapper > .body-wrapper {
	position: relative;
}

.page-wrapper::before {
	content: "";
	position: fixed;
	right: -6vw;
	bottom: -14vh;
	z-index: 0;
	height: max(92vh, 300px);
	aspect-ratio: 775 / 968;
	background: url(../../../img/svg/logos/logo-maestra-2026.svg) no-repeat center / contain;
	opacity: 0.1;
	pointer-events: none;
	-webkit-mask-image: linear-gradient(315deg, #000 14%, rgba(0, 0, 0, 0.45) 50%, transparent 84%);
	mask-image: linear-gradient(315deg, #000 14%, rgba(0, 0, 0, 0.45) 50%, transparent 84%);
}

html[data-bs-theme="dark"] .page-wrapper::before {
	opacity: 0.13;
}

/* Page plein écran sans .body-wrapper (Excalidraw) : rien pour couvrir le filigrane. */
.page-wrapper:not(:has(> .body-wrapper))::before {
	display: none;
}

@media (max-width: 575.98px) {
	.page-wrapper::before {
		right: -30vw;
		bottom: -8vh;
		height: max(62vh, 260px);
		opacity: 0.07;
	}
}

/* --------------------------------------------------------------------------------------------- Plugin Apimo listing — viewport-fit, table-only scroll */
.page-wrapper:has(> .body-wrapper[p-apimo]) {
	height: 100vh;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.body-wrapper[p-apimo] {
	flex: 1;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	min-height: 0;
}

.body-wrapper[p-apimo] > .container-fluid {
	flex: 1;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	min-height: 0;
}

.body-wrapper[p-apimo] .searchable-container {
	flex: 1;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	min-height: 0;
}

.body-wrapper[p-apimo] .searchable-container > .card:last-child {
	flex: 1;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	min-height: 0;
}

.body-wrapper[p-apimo] > .container-fluid > .card:first-child {
	flex: 0 0 auto;
}

.body-wrapper[p-apimo] .searchable-container > .card:not(:last-child) {
	flex: 0 0 auto;
}

.body-wrapper[p-apimo] .searchable-container > .card:last-child > .table-responsive {
	flex: 1;
	overflow-y: auto;
}

.body-wrapper[p-apimo] .searchable-container > .card:last-child .table thead {
	position: sticky;
	top: 0;
	z-index: 1;
	background: var(--bs-body-bg, #fff);
}

/* --------------------------------------------------------------------------------------------- Listing searchable-container — viewport-fit, table-only scroll (même mécanique que [p-system-plugins]) */
.page-wrapper:has(> .body-wrapper[p-listing-scroll]) {
	height: 100vh;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.body-wrapper[p-listing-scroll] {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	min-height: 0;
}

.body-wrapper[p-listing-scroll] > .container-fluid {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	min-height: 0;
}

.body-wrapper[p-listing-scroll] > .container-fluid > :not(.searchable-container) {
	flex: 0 0 auto;
}

.body-wrapper[p-listing-scroll] .searchable-container {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	min-height: 0;
	overflow: hidden;
}

/* Recherche, compteurs, modales : hauteur naturelle. Seule la dernière carte (le tableau) prend le reste. */
.body-wrapper[p-listing-scroll] .searchable-container > .card:not(:last-child) {
	flex: 0 0 auto;
}

.body-wrapper[p-listing-scroll] .searchable-container > .card:last-child {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	min-height: 0;
	margin-bottom: 0;
	overflow: hidden;
}

.body-wrapper[p-listing-scroll] .searchable-container > .card:last-child > .table-responsive {
	flex: 1 1 0;
	height: 0;
	min-height: 0;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	scroll-padding-bottom: 1.35rem;
}

.body-wrapper[p-listing-scroll] .searchable-container > .card:last-child .table thead th {
	position: sticky;
	top: 0;
	z-index: 2;
	background: var(--bs-body-bg, #fff);
}

/* --------------------------------------------------------------------------------------------- System plugins listing — viewport-fit, table-only scroll */
.page-wrapper:has(> .body-wrapper[p-system-plugins]) {
	height: 100vh;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.body-wrapper[p-system-plugins] {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	min-height: 0;
}

.body-wrapper[p-system-plugins] > .container-fluid {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	min-height: 0;
}

.body-wrapper[p-system-plugins] > .container-fluid > :not(.system-plugins-list-row) {
	flex: 0 0 auto;
}

.body-wrapper[p-system-plugins] .system-plugins-list-row {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	min-height: 0;
	overflow: hidden;
}

.body-wrapper[p-system-plugins] .system-plugins-list-row > .col-12 {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	min-height: 0;
	overflow: hidden;
}

.body-wrapper[p-system-plugins] .system-plugins-list-card {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	min-height: 0;
	margin-bottom: 0;
	overflow: hidden;
}

.body-wrapper[p-system-plugins] .system-plugins-list-card__body {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	min-height: 0;
	padding-bottom: 1.35rem;
	overflow: hidden;
}

.body-wrapper[p-system-plugins] #formPluginsFilter {
	flex: 0 0 auto;
}

.body-wrapper[p-system-plugins] .system-plugins-list-table-wrap {
	flex: 1 1 0;
	height: 0;
	min-height: 0;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	padding-bottom: 1.35rem;
	scroll-padding-bottom: 1.35rem;
}

.body-wrapper[p-system-plugins] .system-plugins-list-table-wrap.table-responsive {
	overflow: auto;
}

.body-wrapper[p-system-plugins] .system-plugins-list-table-wrap .table thead th {
	position: sticky;
	top: 0;
	z-index: 2;
	background: var(--bs-body-bg, #fff);
	padding: 1rem 1.35rem;
}

.body-wrapper[p-system-plugins] .system-plugins-list-table-wrap .table tbody td {
	padding: 1.05rem 1.35rem;
}

.body-wrapper[p-system-plugins] .system-plugins-list-table-wrap .table tbody tr:last-child td {
	padding-bottom: 1.5rem;
}

.body-wrapper[p-system-plugins] tr.plugin-row-blocked td {
	background-color: var(--bs-danger-bg-subtle);
}

.body-wrapper[p-system-plugins] .plugin-list-avatar {
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.body-wrapper[p-system-plugins] .plugin-list-identity {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.28rem;
	min-width: 0;
}

.body-wrapper[p-system-plugins] .plugin-role-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.28rem;
}

.body-wrapper[p-system-plugins] .plugin-role-chip {
	display: inline-flex;
	align-items: center;
	padding: 0.08rem 0.45rem;
	border-radius: 999px;
	font-size: 0.6875rem;
	font-weight: 650;
	letter-spacing: 0.01em;
	line-height: 1.35;
	border: 1px solid transparent;
}

.body-wrapper[p-system-plugins] .plugin-role-chip--service {
	color: var(--bs-primary, #5d87ff);
	background: color-mix(in srgb, var(--bs-primary, #5d87ff) 12%, transparent);
	border-color: color-mix(in srgb, var(--bs-primary, #5d87ff) 22%, transparent);
}

.body-wrapper[p-system-plugins] .plugin-role-chip--app {
	color: #0d9488;
	background: color-mix(in srgb, #14b8a6 14%, transparent);
	border-color: color-mix(in srgb, #14b8a6 24%, transparent);
}

.body-wrapper[p-system-plugins] .plugin-role-chip--models {
	color: #6d28d9;
	background: color-mix(in srgb, #8b5cf6 14%, transparent);
	border-color: color-mix(in srgb, #8b5cf6 24%, transparent);
}

.body-wrapper[p-system-plugins] .plugin-role-chip--native {
	color: var(--bs-secondary-color, #5a6a85);
	background: color-mix(in srgb, var(--bs-secondary-color, #5a6a85) 12%, transparent);
	border-color: color-mix(in srgb, var(--bs-secondary-color, #5a6a85) 22%, transparent);
}

html[data-bs-theme="dark"] .body-wrapper[p-system-plugins] .plugin-role-chip--service {
	color: #93b4ff;
	background: color-mix(in srgb, #5d87ff 18%, transparent);
	border-color: color-mix(in srgb, #5d87ff 28%, transparent);
}

html[data-bs-theme="dark"] .body-wrapper[p-system-plugins] .plugin-role-chip--app {
	color: #5eead4;
	background: color-mix(in srgb, #14b8a6 18%, transparent);
	border-color: color-mix(in srgb, #14b8a6 28%, transparent);
}

html[data-bs-theme="dark"] .body-wrapper[p-system-plugins] .plugin-role-chip--models {
	color: #c4b5fd;
	background: color-mix(in srgb, #8b5cf6 18%, transparent);
	border-color: color-mix(in srgb, #8b5cf6 28%, transparent);
}

html[data-bs-theme="dark"] .body-wrapper[p-system-plugins] .plugin-role-chip--native {
	color: #b7c3d4;
	background: color-mix(in srgb, #b7c3d4 14%, transparent);
	border-color: color-mix(in srgb, #b7c3d4 24%, transparent);
}

.body-wrapper[p-system-plugins] .plugin-list-avatar img {
	width: 40px;
	height: 40px;
	object-fit: contain;
	border-radius: 0.45rem;
}

/* --------------------------------------------------------------------------------------------- Bascule liste / grille */
/* Les deux vues sont rendues ensemble par le dispatch : la bascule n'est qu'une classe sur le
   card-body, rien n'est rechargé au clic. */
.body-wrapper[p-system-plugins] .system-plugins-view-switch {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 0.125rem;
	padding: 0.1875rem;
	border: 1px solid var(--bs-border-color);
	border-radius: 0.65rem;
	background: var(--bs-tertiary-bg, #f6f7f9);
}

.body-wrapper[p-system-plugins] .system-plugins-view-switch__thumb {
	position: absolute;
	top: 0.1875rem;
	left: 0.1875rem;
	width: 2.25rem;
	height: calc(100% - 0.375rem);
	border-radius: 0.5rem;
	background: var(--bs-body-bg, #fff);
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
	transition: transform 0.18s cubic-bezier(0.22, 1, 0.36, 1);
}

.body-wrapper[p-system-plugins] .system-plugins-list-card__body.is-view-grid .system-plugins-view-switch__thumb {
	transform: translateX(calc(100% + 0.125rem));
}

.body-wrapper[p-system-plugins] .system-plugins-view-switch__btn {
	position: relative;
	z-index: 1;
	width: 2.25rem;
	height: 1.85rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 0;
	border-radius: 0.5rem;
	background: transparent;
	color: var(--bs-secondary-color, #6c757d);
	cursor: pointer;
	transition: color 0.15s ease;
}

.body-wrapper[p-system-plugins] .system-plugins-view-switch__btn:hover {
	color: var(--bs-body-color);
}

.body-wrapper[p-system-plugins] .system-plugins-view-switch__btn.is-active {
	color: var(--bs-primary, #5d87ff);
}

.body-wrapper[p-system-plugins] .system-plugins-view-switch__btn:focus {
	outline: 0;
}

.body-wrapper[p-system-plugins] .system-plugins-view-switch__btn:focus-visible {
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--bs-primary, #5d87ff) 35%, transparent);
}

@media (prefers-reduced-motion: reduce) {
	.body-wrapper[p-system-plugins] .system-plugins-view-switch__thumb {
		transition: none;
	}
}

.body-wrapper[p-system-plugins] .system-plugins-list-toolbar {
	flex-wrap: wrap;
	row-gap: 0.5rem;
}

/* --------------------------------------------------------------------------------------------- Recherche instantanée */
/* Même gabarit que le segmenté et les boutons de filtre : hauteur, rayon, bordure fine.
   Pas de bouton de soumission, le filtrage se fait à la frappe. */
.body-wrapper[p-system-plugins] .system-plugins-search {
	position: relative;
	display: inline-flex;
	align-items: center;
	margin-right: auto; /* Recherche à gauche, affichage et filtres restent à droite */
	width: 100%;
	max-width: 16rem;
	height: 2.35rem;
	border: 1px solid var(--bs-border-color);
	border-radius: 0.65rem;
	background: var(--bs-tertiary-bg, #f6f7f9);
	transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.body-wrapper[p-system-plugins] .system-plugins-search:focus-within {
	background: var(--bs-body-bg, #fff);
	border-color: color-mix(in srgb, var(--bs-primary, #5d87ff) 45%, transparent);
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--bs-primary, #5d87ff) 18%, transparent);
}

.body-wrapper[p-system-plugins] .system-plugins-search__icon {
	flex: 0 0 auto;
	padding: 0 0.35rem 0 0.65rem;
	font-size: 1rem;
	color: var(--bs-secondary-color, #6c757d);
}

.body-wrapper[p-system-plugins] .system-plugins-search__input {
	flex: 1 1 auto;
	min-width: 0;
	height: 100%;
	padding: 0 0.35rem 0 0;
	border: 0;
	background: transparent;
	color: var(--bs-body-color);
	font-size: 0.8125rem;
	font-weight: 500;
	line-height: 1;
}

.body-wrapper[p-system-plugins] .system-plugins-search__input::placeholder {
	color: var(--bs-secondary-color, #6c757d);
	opacity: 0.85;
}

.body-wrapper[p-system-plugins] .system-plugins-search__input:focus {
	outline: 0;
	box-shadow: none;
}

.body-wrapper[p-system-plugins] .system-plugins-search__clear {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.5rem;
	height: 1.5rem;
	margin-right: 0.35rem;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--bs-secondary-color, #6c757d);
	font-size: 0.85rem;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.body-wrapper[p-system-plugins] .system-plugins-search__clear:hover {
	background: var(--bs-secondary-bg, rgba(0, 0, 0, 0.06));
	color: var(--bs-body-color);
}

.body-wrapper[p-system-plugins] .system-plugins-search__clear:focus {
	outline: 0;
}

.body-wrapper[p-system-plugins] .system-plugins-search__clear:focus-visible {
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--bs-primary, #5d87ff) 35%, transparent);
}

/* --------------------------------------------------------------------------------------------- Aucun résultat */
.body-wrapper[p-system-plugins] .system-plugins-empty {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.3rem;
	padding: 2.5rem 1rem;
	text-align: center;
}

.body-wrapper[p-system-plugins] .system-plugins-empty__icon {
	font-size: 2rem;
	line-height: 1;
	color: var(--bs-secondary-color, #6c757d);
	opacity: 0.55;
	margin-bottom: 0.35rem;
}

.body-wrapper[p-system-plugins] .system-plugins-empty__title {
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--bs-body-color);
}

.body-wrapper[p-system-plugins] .system-plugins-empty__text {
	font-size: 0.8125rem;
	color: var(--bs-secondary-color, #6c757d);
}

.body-wrapper[p-system-plugins] .system-plugins-list-card__body.is-empty .system-plugins-list-table-wrap,
.body-wrapper[p-system-plugins] .system-plugins-list-card__body.is-empty .system-plugins-grid-wrap {
	display: none;
}

/* --------------------------------------------------------------------------------------------- Boutons de filtre (catégorie, rôle) */
/* Mêmes gabarits que le segmenté liste / grille (hauteur, rayon), mais en bleu : ce sont les
   deux commandes de tri de la page. Le pluriel du libellé signale l'absence de filtre. */
.body-wrapper[p-system-plugins] .system-plugins-filter-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	height: 2.35rem;
	max-width: 12rem;
	padding: 0 0.8rem;
	border: 1px solid color-mix(in srgb, var(--bs-primary, #5d87ff) 26%, transparent);
	border-radius: 0.65rem;
	background: color-mix(in srgb, var(--bs-primary, #5d87ff) 11%, transparent);
	color: var(--bs-primary, #5d87ff);
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease;
}

.body-wrapper[p-system-plugins] .system-plugins-filter-btn [data-spf-label] {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.body-wrapper[p-system-plugins] .system-plugins-filter-btn__caret {
	font-size: 0.9rem;
	opacity: 0.7;
	transition: transform 0.16s ease;
}

.body-wrapper[p-system-plugins] .system-plugins-filter-btn:hover {
	background: color-mix(in srgb, var(--bs-primary, #5d87ff) 18%, transparent);
	border-color: color-mix(in srgb, var(--bs-primary, #5d87ff) 38%, transparent);
}

/* Filtre réellement posé, ou menu ouvert : bleu plein, pour le distinguer de l'état « tout ». */
.body-wrapper[p-system-plugins] .system-plugins-filter-btn.is-on,
.body-wrapper[p-system-plugins] .system-plugins-filter-btn.is-open {
	color: #fff;
	background: var(--bs-primary, #5d87ff);
	border-color: var(--bs-primary, #5d87ff);
}

.body-wrapper[p-system-plugins] .system-plugins-filter-btn.is-open .system-plugins-filter-btn__caret {
	transform: rotate(180deg);
}

.body-wrapper[p-system-plugins] .system-plugins-filter-btn:focus {
	outline: 0;
}

.body-wrapper[p-system-plugins] .system-plugins-filter-btn:focus-visible {
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--bs-primary, #5d87ff) 35%, transparent);
}

@media (prefers-reduced-motion: reduce) {
	.body-wrapper[p-system-plugins] .system-plugins-filter-btn__caret {
		transition: none;
	}
}

.body-wrapper[p-system-plugins] .system-plugins-list-card__body.is-view-list .system-plugins-grid-wrap,
.body-wrapper[p-system-plugins] .system-plugins-list-card__body.is-view-grid .system-plugins-list-table-wrap {
	display: none;
}

/* --------------------------------------------------------------------------------------------- Vue grille */
/* Même zone de défilement que le tableau : le card-body garde la main sur la hauteur. */
.body-wrapper[p-system-plugins] .system-plugins-grid-wrap {
	flex: 1 1 0;
	height: 0;
	min-height: 0;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	padding-bottom: 1.35rem;
	scroll-padding-bottom: 1.35rem;
}

/* La carte se soulève de 2px au survol et porte une ombre portée : sans cette marge
   intérieure, le conteneur de défilement rogne le haut de la carte survolée. */
.body-wrapper[p-system-plugins] .system-plugins-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	gap: 1rem;
	padding: 0.5rem 0.6rem 0;
}

@media (max-width: 575.98px) {
	.body-wrapper[p-system-plugins] .system-plugins-grid {
		grid-template-columns: 1fr;
	}
}

.body-wrapper[p-system-plugins] .plugin-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
	padding: 1rem;
	border: 1px solid var(--bs-border-color);
	border-radius: 0.75rem;
	background: var(--bs-body-bg, #fff);
	transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.body-wrapper[p-system-plugins] .plugin-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
	border-color: color-mix(in srgb, var(--bs-primary, #5d87ff) 28%, var(--bs-border-color));
}

@media (prefers-reduced-motion: reduce) {
	.body-wrapper[p-system-plugins] .plugin-card {
		transition: none;
	}

	.body-wrapper[p-system-plugins] .plugin-card:hover {
		transform: none;
	}
}

.body-wrapper[p-system-plugins] .plugin-card.plugin-row-blocked {
	background: var(--bs-danger-bg-subtle);
	border-color: color-mix(in srgb, var(--bs-danger, #fa896b) 25%, var(--bs-border-color));
}

html[data-bs-theme="dark"] .body-wrapper[p-system-plugins] .plugin-card:hover {
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.45);
}

.body-wrapper[p-system-plugins] .plugin-card__head {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	min-width: 0;
}

.body-wrapper[p-system-plugins] .plugin-card__identity {
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
	min-width: 0;
}

.body-wrapper[p-system-plugins] .plugin-card__name {
	margin: 0;
	font-size: 0.95rem;
	font-weight: 600;
	line-height: 1.3;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.body-wrapper[p-system-plugins] .plugin-card__version {
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--bs-secondary-color, #6c757d);
}

.body-wrapper[p-system-plugins] .plugin-card__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.28rem;
}

.body-wrapper[p-system-plugins] .plugin-card__chips:empty {
	display: none;
}

.body-wrapper[p-system-plugins] .plugin-card__scoring:empty {
	display: none;
}

.body-wrapper[p-system-plugins] .plugin-card__actions {
	display: flex;
	margin-top: auto;
	padding-top: 0.5rem;
	border-top: 1px solid var(--bs-border-color);
}

/* Toute la carte ouvre le plugin. La zone cliquable est une ancre posée sous les icônes
   d'action, pas un wrapper : imbriquer les actions dans un lien serait invalide.
   Le lien accessible reste l'icône œil, d'où le tabindex/aria-hidden sur la nappe. */
.body-wrapper[p-system-plugins] .plugin-card__hit {
	position: absolute;
	inset: 0;
	z-index: 1;
	border-radius: inherit;
}

.body-wrapper[p-system-plugins] .plugin-card .mm-row-action {
	z-index: 2;
}

.body-wrapper[p-system-plugins] .plugin-cat-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.28rem;
}

.body-wrapper[p-system-plugins] .plugin-cat-chip {
	display: inline-flex;
	align-items: center;
	padding: 0.08rem 0.45rem;
	border-radius: 999px;
	font-size: 0.6875rem;
	font-weight: 550;
	line-height: 1.35;
	color: var(--bs-secondary-color, #6c757d);
	background: var(--bs-tertiary-bg, #f6f7f9);
	border: 1px solid var(--bs-border-color);
}

.body-wrapper[p-system-plugins] .plugin-depends-btn.is-blocked {
	animation: plugin-depends-pulse 1.6s ease-in-out infinite;
}

.body-wrapper[p-system-plugins] .plugin-depends-badge {
	position: absolute;
	top: -0.15rem;
	right: -0.15rem;
	min-width: 1.05rem;
	height: 1.05rem;
	padding: 0 0.25rem;
	border-radius: 999px;
	background: var(--bs-danger);
	color: #fff;
	font-size: 0.65rem;
	font-weight: 700;
	line-height: 1.05rem;
	text-align: center;
}

@keyframes plugin-depends-pulse {
	0%, 100% { opacity: 1; }
	50% { opacity: 0.55; }
}

.body-wrapper[p-system-plugins] .plugin-depend-row-missing {
	background-color: var(--bs-danger-bg-subtle);
}

.body-wrapper[p-system-plugins] #modalPluginDepends #pluginDependsAlert.plugin-depends-modal-alert {
	flex-shrink: 0;
	padding: 1rem var(--bs-modal-padding, 1.5rem) 0.75rem;
	background: var(--bs-modal-bg, var(--bs-body-bg, #fff));
}

.body-wrapper[p-system-plugins] #modalPluginDepends #pluginDependsAlert.plugin-depends-modal-alert:empty {
	display: none;
	padding: 0;
}

.body-wrapper[p-system-plugins] .plugin-depends-block {
	padding: 1rem 1rem 0.9rem;
	border: 1px solid var(--bs-border-color);
	border-radius: 0.75rem;
	background: var(--bs-tertiary-bg, var(--bs-light-bg-subtle, #f8f9fa));
}

.body-wrapper[p-system-plugins] .plugin-depends-block__head {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	margin-bottom: 0.85rem;
}

.body-wrapper[p-system-plugins] .plugin-depends-block__icon {
	flex-shrink: 0;
	width: 2.25rem;
	height: 2.25rem;
	border-radius: 0.6rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 1.15rem;
	line-height: 1;
	color: var(--bs-primary);
	background: var(--bs-primary-bg-subtle);
}

.body-wrapper[p-system-plugins] .plugin-depends-block__titles {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
}

.body-wrapper[p-system-plugins] .plugin-depends-block__title {
	font-size: 0.72rem;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--bs-emphasis-color, #212529);
}

.body-wrapper[p-system-plugins] .plugin-depends-block__subtitle {
	font-size: 0.78rem;
	line-height: 1.3;
	color: var(--bs-secondary-color, #6c757d);
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.body-wrapper[p-system-plugins] .plugin-depends-block__badge {
	flex-shrink: 0;
	align-self: center;
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.32rem 0.62rem;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.02em;
}

.body-wrapper[p-system-plugins] .plugin-depends-block__badge::before {
	content: "";
	width: 0.4rem;
	height: 0.4rem;
	border-radius: 50%;
	background: currentColor;
}

.body-wrapper[p-system-plugins] .plugin-depends-block__badge:empty {
	display: none;
}

.body-wrapper[p-system-plugins] .plugin-depends-block__list {
	border: 1px solid var(--bs-border-color);
	border-radius: 0.6rem;
	overflow: hidden;
	background: var(--bs-body-bg, #fff);
}

html[data-bs-theme="dark"] .body-wrapper[p-system-plugins] .plugin-depends-block {
	background: rgba(255, 255, 255, 0.04);
}

/* Modales fichiers d'un plugin (Excalidraw, graphs React Flow) */
.body-wrapper[p-system-plugins] .plugin-files-modal .modal-header {
	gap: 0.75rem;
	align-items: center;
}

.body-wrapper[p-system-plugins] .plugin-files-modal__icon {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	color: var(--bs-primary);
	background: var(--bs-primary-bg-subtle);
}

.body-wrapper[p-system-plugins] .plugin-files-modal__icon {
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 0.7rem;
	font-size: 1.25rem;
}

.body-wrapper[p-system-plugins] .plugin-files-modal__titles {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}

.body-wrapper[p-system-plugins] .plugin-files-modal .modal-title {
	margin: 0;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.body-wrapper[p-system-plugins] .plugin-files-modal__subtitle {
	font-size: 0.72rem;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--bs-secondary-color, #6c757d);
}

.body-wrapper[p-system-plugins] .plugin-files-modal__list {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.body-wrapper[p-system-plugins] .plugin-file-row {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	min-width: 0;
	padding: 0.75rem 0.75rem 0.75rem 1rem;
	border: 1px solid var(--bs-border-color);
	border-radius: 0.75rem;
	background: var(--bs-tertiary-bg, var(--bs-light-bg-subtle, #f8f9fa));
	box-shadow: inset 3px 0 0 transparent;
	color: var(--bs-body-color);
	text-decoration: none;
	transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

.body-wrapper[p-system-plugins] .plugin-file-row:hover,
.body-wrapper[p-system-plugins] .plugin-file-row:focus-visible {
	border-color: color-mix(in srgb, var(--bs-primary) 45%, var(--bs-border-color));
	background: color-mix(in srgb, var(--bs-primary) 6%, var(--bs-body-bg, #fff));
	box-shadow: inset 3px 0 0 var(--bs-primary), 0 6px 18px -12px color-mix(in srgb, var(--bs-primary) 60%, transparent);
	outline: none;
}

.body-wrapper[p-system-plugins] .plugin-file-row:hover .plugin-file-row__name,
.body-wrapper[p-system-plugins] .plugin-file-row:focus-visible .plugin-file-row__name {
	color: var(--bs-primary);
}

.body-wrapper[p-system-plugins] .plugin-file-row__text {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
}

.body-wrapper[p-system-plugins] .plugin-file-row__name {
	font-size: 0.92rem;
	font-weight: 600;
	line-height: 1.25;
	color: var(--bs-emphasis-color, #212529);
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.body-wrapper[p-system-plugins] .plugin-file-row__meta {
	font-size: 0.75rem;
	line-height: 1.3;
	color: var(--bs-secondary-color, #6c757d);
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.body-wrapper[p-system-plugins] .plugin-file-row__badge {
	flex-shrink: 0;
	padding: 0.28rem 0.6rem;
	border-radius: 50rem;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: var(--bs-primary);
	background: var(--bs-primary-bg-subtle);
}

.body-wrapper[p-system-plugins] .plugin-file-row__badge[data-type="process"] {
	color: var(--bs-success);
	background: var(--bs-success-bg-subtle);
}

.body-wrapper[p-system-plugins] .plugin-file-row__badge[data-type="workflow"] {
	color: var(--bs-warning-text-emphasis, var(--bs-warning));
	background: var(--bs-warning-bg-subtle);
}

.body-wrapper[p-system-plugins] .plugin-file-row__badge:empty,
.body-wrapper[p-system-plugins] .plugin-file-row__meta:empty {
	display: none;
}

.body-wrapper[p-system-plugins] .plugin-file-row__open {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	font-size: 1rem;
	color: var(--bs-secondary-color, #6c757d);
	transition: color 0.15s ease, background-color 0.15s ease, transform 0.15s ease;
}

.body-wrapper[p-system-plugins] .plugin-file-row:hover .plugin-file-row__open,
.body-wrapper[p-system-plugins] .plugin-file-row:focus-visible .plugin-file-row__open {
	color: var(--bs-primary);
	background: var(--bs-primary-bg-subtle);
	transform: translate(1px, -1px);
}

.body-wrapper[p-system-plugins] .plugin-file-row.is-empty {
	pointer-events: none;
	border-style: dashed;
	background: transparent;
}

.body-wrapper[p-system-plugins] .plugin-file-row.is-empty .plugin-file-row__open {
	display: none;
}

/* --bs-tertiary-bg reste le gris Bootstrap (#2b3035) : il jure sur le bleu nuit du thème */
html[data-bs-theme="dark"] .body-wrapper[p-system-plugins] .plugin-file-row {
	background: rgba(255, 255, 255, 0.04);
}

html[data-bs-theme="dark"] .body-wrapper[p-system-plugins] .plugin-file-row:hover,
html[data-bs-theme="dark"] .body-wrapper[p-system-plugins] .plugin-file-row:focus-visible {
	background: color-mix(in srgb, var(--bs-primary) 12%, var(--bs-body-bg, #161d21));
}

html[data-bs-theme="dark"] .body-wrapper[p-system-plugins] .plugin-file-row.is-empty {
	background: transparent;
}

@media (prefers-reduced-motion: reduce) {
	.body-wrapper[p-system-plugins] .plugin-file-row,
	.body-wrapper[p-system-plugins] .plugin-file-row__open {
		transition: none;
	}
}

.body-wrapper[p-system-plugins] .plugin-repo-menu {
	position: relative;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: inherit;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.body-wrapper[p-system-plugins] .plugin-repo-menu:hover,
.body-wrapper[p-system-plugins] .plugin-repo-menu.is-open {
	background-color: var(--bs-primary-bg-subtle);
}

.body-wrapper[p-system-plugins] .system-plugins-list-table-wrap .table thead th.plugin-scoring-col,
.body-wrapper[p-system-plugins] .system-plugins-list-table-wrap .table tbody td.plugin-scoring-col {
	width: 6.2rem;
	max-width: 6.2rem;
	padding-left: 0.55rem;
	padding-right: 0.7rem;
	vertical-align: middle;
	white-space: nowrap;
}

.body-wrapper[p-system-plugins] .plugin-scoring-head {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
}

.body-wrapper[p-system-plugins] .plugin-scoring-help {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.15rem;
	height: 1.15rem;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--bs-secondary-color, #6c757d);
	font-size: 0.95rem;
	line-height: 1;
	cursor: pointer;
	opacity: 0.6;
	transition: color 0.15s ease, background-color 0.15s ease, opacity 0.15s ease;
}

.body-wrapper[p-system-plugins] .plugin-scoring-help:hover,
.body-wrapper[p-system-plugins] .plugin-scoring-help:focus-visible {
	color: var(--bs-primary);
	background-color: var(--bs-primary-bg-subtle);
	opacity: 1;
}

/* Jauge annulaire : cercle r=12 (circonférence 75.398) découpé en 5 créneaux de 15.0796,
   soit 12.48 d'arc plein + 2.6 de gap. Le décalage d'un demi-gap centre chaque segment. */
.body-wrapper[p-system-plugins] .plugin-scoring {
	--mm-scoring-size: 1.8rem;
	--mm-scoring-circumference: 75.398;
	--mm-scoring-arc: 12.48;
	--mm-scoring-rest: 62.918;
	--mm-scoring-track: color-mix(in srgb, var(--bs-primary) 16%, var(--bs-border-color, #dee2e6));
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
	width: max-content;
}

.body-wrapper[p-system-plugins] .plugin-scoring__row {
	display: flex;
	align-items: center;
	gap: 0.42rem;
	cursor: default;
}

.body-wrapper[p-system-plugins] .plugin-scoring__gauge {
	position: relative;
	flex-shrink: 0;
	width: var(--mm-scoring-size);
	height: var(--mm-scoring-size);
}

.body-wrapper[p-system-plugins] .plugin-scoring__ring {
	display: block;
	width: 100%;
	height: 100%;
	/* Premier segment en haut plutôt qu'à 3 h */
	transform: rotate(-90deg);
}

.body-wrapper[p-system-plugins] .plugin-scoring__track,
.body-wrapper[p-system-plugins] .plugin-scoring__seg {
	fill: none;
	stroke-width: 3.6;
}

.body-wrapper[p-system-plugins] .plugin-scoring__track {
	stroke: var(--mm-scoring-track);
	/* Motif répété : 5 créneaux exactement sur le tour */
	stroke-dasharray: var(--mm-scoring-arc) 2.6;
	stroke-dashoffset: -1.3;
}

.body-wrapper[p-system-plugins] .plugin-scoring__seg {
	stroke: var(--bs-primary);
	stroke-dasharray: var(--mm-scoring-arc) var(--mm-scoring-rest);
	animation: plugin-scoring-draw 0.42s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.body-wrapper[p-system-plugins] .plugin-scoring__seg:nth-child(2) { stroke-dashoffset: -1.3; }
.body-wrapper[p-system-plugins] .plugin-scoring__seg:nth-child(3) { stroke-dashoffset: -16.38; animation-delay: 0.05s; }
.body-wrapper[p-system-plugins] .plugin-scoring__seg:nth-child(4) { stroke-dashoffset: -31.46; animation-delay: 0.1s; }
.body-wrapper[p-system-plugins] .plugin-scoring__seg:nth-child(5) { stroke-dashoffset: -46.54; animation-delay: 0.15s; }
.body-wrapper[p-system-plugins] .plugin-scoring__seg:nth-child(6) { stroke-dashoffset: -61.62; animation-delay: 0.2s; }

.body-wrapper[p-system-plugins] .plugin-scoring__row[data-score="5"] .plugin-scoring__ring {
	filter: drop-shadow(0 0 3px color-mix(in srgb, var(--bs-primary) 45%, transparent));
}

.body-wrapper[p-system-plugins] .plugin-scoring__value {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.7rem;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	line-height: 1;
	color: var(--bs-primary);
}

.body-wrapper[p-system-plugins] .plugin-scoring__row.is-empty .plugin-scoring__value {
	font-size: 0.47rem;
	letter-spacing: 0.04em;
	color: var(--bs-secondary-color, #6c757d);
}

.body-wrapper[p-system-plugins] .plugin-scoring__row.is-empty .plugin-scoring__track {
	opacity: 0.55;
}

.body-wrapper[p-system-plugins] .plugin-scoring__label {
	font-size: 0.58rem;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	line-height: 1;
	color: var(--bs-secondary-color, #6c757d);
}

@keyframes plugin-scoring-draw {
	from { stroke-dasharray: 0 var(--mm-scoring-circumference); }
	to { stroke-dasharray: var(--mm-scoring-arc) var(--mm-scoring-rest); }
}

@media (prefers-reduced-motion: reduce) {
	.body-wrapper[p-system-plugins] .plugin-scoring__seg {
		animation: none;
	}
}

html[data-bs-theme="dark"] .body-wrapper[p-system-plugins] .plugin-scoring {
	--mm-scoring-track: color-mix(in srgb, var(--bs-primary) 26%, rgba(255, 255, 255, 0.12));
}

/* ----- Modale explicative du scoring ----- */
.plugin-scoring-modal__intro {
	margin-bottom: 1rem;
	font-size: 0.88rem;
	color: var(--bs-secondary-color, #6c757d);
}

.plugin-scoring-modal__criteria {
	display: grid;
	gap: 0.6rem;
	margin-bottom: 1.35rem;
}

.plugin-scoring-modal__criterion {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	padding: 0.75rem 0.85rem;
	border: 1px solid var(--bs-border-color);
	border-radius: 0.7rem;
	background: var(--bs-tertiary-bg, #f8f9fa);
}

.plugin-scoring-modal__criterion-icon {
	flex-shrink: 0;
	width: 2.1rem;
	height: 2.1rem;
	border-radius: 0.6rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 1.1rem;
	line-height: 1;
	color: var(--bs-primary);
	background: var(--bs-primary-bg-subtle);
}

.plugin-scoring-modal__criterion-title {
	display: block;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--bs-emphasis-color, #212529);
}

.plugin-scoring-modal__criterion-desc {
	display: block;
	margin-top: 0.15rem;
	font-size: 0.82rem;
	line-height: 1.45;
	color: var(--bs-secondary-color, #6c757d);
}

.plugin-scoring-modal__title {
	display: block;
	margin-bottom: 0.6rem;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--bs-emphasis-color, #212529);
}

.plugin-scoring-modal__scale {
	list-style: none;
	margin: 0 0 1rem;
	padding: 0;
	display: grid;
	gap: 0.42rem;
}

.plugin-scoring-modal__scale li {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	font-size: 0.83rem;
	color: var(--bs-secondary-color, #6c757d);
}

.plugin-scoring-modal__scale b {
	color: var(--bs-emphasis-color, #212529);
	font-variant-numeric: tabular-nums;
}

/* Même anneau que le listing : 5 créneaux de 72°, gap de 12.4° centré sur les multiples de 72° */
.plugin-scoring-modal__level {
	--mm-legend-track: color-mix(in srgb, var(--bs-primary) 16%, var(--bs-border-color, #dee2e6));
	--mm-legend-hole: var(--bs-modal-bg, var(--bs-body-bg, #fff));
	position: relative;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.9rem;
	height: 1.9rem;
}

.plugin-scoring-modal__level::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	/* Le disque du dessus creuse l'anneau, le masque conique découpe les 5 segments */
	background:
		radial-gradient(circle at 50% 50%, var(--mm-legend-hole) 0 0.71rem, transparent 0.73rem),
		conic-gradient(from -90deg,
			var(--bs-primary) 0 calc(var(--mm-legend-level, 0) * 72deg),
			var(--mm-legend-track) calc(var(--mm-legend-level, 0) * 72deg) 360deg);
	-webkit-mask: repeating-conic-gradient(from -90deg, transparent 0 6.2deg, #000 6.2deg 65.8deg, transparent 65.8deg 72deg);
	mask: repeating-conic-gradient(from -90deg, transparent 0 6.2deg, #000 6.2deg 65.8deg, transparent 65.8deg 72deg);
}

.plugin-scoring-modal__level[data-level="0"] { --mm-legend-level: 0; }
.plugin-scoring-modal__level[data-level="1"] { --mm-legend-level: 1; }
.plugin-scoring-modal__level[data-level="2"] { --mm-legend-level: 2; }
.plugin-scoring-modal__level[data-level="3"] { --mm-legend-level: 3; }
.plugin-scoring-modal__level[data-level="4"] { --mm-legend-level: 4; }
.plugin-scoring-modal__level[data-level="5"] { --mm-legend-level: 5; }

/* position:relative → passe au-dessus du ::before positionné */
.plugin-scoring-modal__scale .plugin-scoring-modal__level b {
	position: relative;
	font-size: 0.72rem;
	font-weight: 700;
	line-height: 1;
	color: var(--bs-primary);
}

.plugin-scoring-modal__scale .plugin-scoring-modal__level[data-level="0"] b {
	font-size: 0.5rem;
	letter-spacing: 0.04em;
	color: var(--bs-secondary-color, #6c757d);
}

.plugin-scoring-modal__level[data-level="0"]::before {
	opacity: 0.55;
}

.plugin-scoring-modal__note {
	margin: 0;
	padding-top: 0.85rem;
	border-top: 1px solid var(--bs-border-color);
	font-size: 0.79rem;
	line-height: 1.5;
	color: var(--bs-secondary-color, #6c757d);
}

html[data-bs-theme="dark"] .plugin-scoring-modal__criterion {
	background: rgba(255, 255, 255, 0.04);
}

html[data-bs-theme="dark"] .plugin-scoring-modal__level {
	--mm-legend-track: color-mix(in srgb, var(--bs-primary) 26%, rgba(255, 255, 255, 0.12));
}

/* ===================================================================
   Documentations plugin — hauteur limitée + thead sticky
   =================================================================== */
.body-wrapper[p-plugin-documentations] .plugin-docs-list-table-wrap {
	max-height: min(52vh, 28rem);
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}

.body-wrapper[p-plugin-documentations] .plugin-docs-list-table-wrap.table-responsive {
	overflow: auto;
}

.body-wrapper[p-plugin-documentations] .plugin-docs-list-table-wrap .table thead th {
	position: sticky;
	top: 0;
	z-index: 2;
	background: var(--bs-body-bg, #fff);
	box-shadow: 0 1px 0 var(--bs-border-color, rgba(0, 0, 0, 0.08));
}

html[data-bs-theme="dark"] .body-wrapper[p-plugin-documentations] .plugin-docs-list-table-wrap .table thead th {
	background: var(--bs-card-bg, var(--bs-body-bg, #1a2537));
}

/* FAB Documentations (accueil plugin) : dropup bas-droite */
.plugin-docs-fab {
	position: fixed;
	right: 1.5rem;
	bottom: 1.5rem;
	z-index: 1040;
}

.plugin-docs-fab__btn {
	width: 3.25rem;
	height: 3.25rem;
	padding: 0;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 0.45rem 1.1rem color-mix(in srgb, var(--bs-primary) 32%, transparent);
}

.plugin-docs-fab__btn:focus-visible {
	outline: 2px solid var(--bs-primary);
	outline-offset: 3px;
}

.plugin-docs-fab__menu {
	min-width: 16rem;
	max-width: min(22rem, calc(100vw - 2rem));
	padding: 0.4rem;
	border-radius: 0.85rem;
}

.plugin-docs-fab__list {
	max-height: min(60vh, 22rem);
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}

.plugin-docs-fab__list .list-group-item {
	background: transparent;
}

.plugin-docs-fab__list .list-group-item:hover,
.plugin-docs-fab__list .list-group-item:focus {
	background: var(--bs-tertiary-bg, rgba(var(--bs-primary-rgb), 0.08));
}

.modal-content {
	--bs-modal-border-radius: var(--mm-modal-radius);
	border: 1px solid var(--mm-modal-border);
	box-shadow: var(--mm-modal-shadow);
}

/* Entrée : ultra rapide et nette — petit lift, settle quasi instantané. */
.modal.fade .modal-dialog {
	transform: translateY(8px) scale(0.99);
	opacity: 0;
	transition: transform 0.18s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.13s ease-out;
}

.modal.show .modal-dialog {
	transform: none;
	opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
	.modal.fade .modal-dialog {
		transform: none;
		transition: none;
	}
}

.modal .btn-close:focus {
	box-shadow: none !important;
}

/* ===================================================================
   <select> natifs en dark — popup d'options lisible partout.
   `color-scheme: dark` (voir :root) fait l'essentiel : chrome natif sombre,
   surbrillance système correcte. On fige en plus le fond/texte des <option>
   en repli pour les navigateurs qui n'héritent pas du color-scheme dans le
   popup (Chromium/Linux notamment). N'affecte pas Selectize (div.option).
   =================================================================== */
html[data-bs-theme="dark"] select,
html[data-bs-theme="dark"] select.form-select,
html[data-bs-theme="dark"] select.form-control {
	color-scheme: dark;
}

html[data-bs-theme="dark"] select option,
html[data-bs-theme="dark"] select optgroup {
	background-color: var(--bs-body-bg, #1a222d);
	color: var(--bs-body-color, #e6edf2);
}

html[data-bs-theme="dark"] select option:checked {
	background-color: color-mix(in srgb, var(--bs-primary, #0d6efd) 26%, var(--bs-body-bg, #1a222d));
	color: #ffffff;
}

.topbar-image {
	background-image: url(../img/demo/frontend-pages/topbar-bg.png) !important;
}

/* ===================================================================
   Dropdowns .content-dd (profil #drop-profil-v, messages, notifs) —
   effet « spotlight » radial.

   Voile : ::before du <li> déclencheur, donc DANS la topbar. Il y couvre
   toute la barre (il se peint au-dessus de son fond) et seul le menu ouvert
   (z-index 1) reste net. Sorti de la topbar, le voile la laisserait
   entièrement éclairée : une bande claire en travers d'une page assombrie.

   Dégradé radial figé, origine au coin d'où s'ouvre le panneau : clair sous
   le menu, sombre à l'opposé. Seule l'opacité est animée, donc chaque pixel
   fond au même rythme. Animer en plus un transform remapperait le dégradé
   pendant la transition et décalerait les bords.

   Pas de backdrop-filter : un flou plein écran fait recomposer tout le
   viewport à chaque frame (voir règle maestra-frontend-modals).

   Déclencheurs :
     • .content-dd.show → clic / Bootstrap
     • :hover           → survol (le thème vendor ouvre au survol)
   =================================================================== */
.nav-item.dropdown:has(> .dropdown-menu.content-dd)::before,
.dropup:has(> .dropdown-menu.content-dd)::before {
	content: "";
	position: fixed;
	inset: 0;
	z-index: 0;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	background: radial-gradient(
		135% 135% at var(--mm-dropdown-veil-origin, 100% 0%),
		var(--mm-dropdown-veil-core) 0%,
		var(--mm-dropdown-veil-mid) 38%,
		var(--mm-dropdown-veil) 78%
	);
	transition: opacity var(--mm-dropdown-veil-fade) ease, visibility 0s linear var(--mm-dropdown-veil-fade);
}

/* Un dropup ouvre depuis le coin bas-gauche */
.dropup:has(> .dropdown-menu.content-dd)::before {
	--mm-dropdown-veil-origin: 0% 100%;
}

.topbar .nav-item.dropdown:has(> .dropdown-menu.content-dd):hover::before,
.nav-item.dropdown:has(> .dropdown-menu.content-dd.show)::before,
.dropup:has(> .dropdown-menu.content-dd):hover::before,
.dropup:has(> .dropdown-menu.content-dd.show)::before {
	opacity: 1;
	visibility: visible;
	transition: opacity var(--mm-dropdown-veil-fade) ease, visibility 0s;
}

/* Le retour au z-index de repos attend la fin du fondu. Le voile vit dans la
   topbar (z-index 50) et ne couvre le menu vertical (99) que pendant qu'elle
   est surélevée : sans ce délai elle retombe dès la sortie du survol, le menu
   ressort d'un coup au premier plan et retrouve sa pleine luminosité alors que
   le reste de la page fond encore. Ces deux règles doivent rester dans cet
   ordre, la seconde étant plus spécifique pour gagner à l'aller.
   .topbar / .sticky-top ne portent aucune transition utile : les redéclarer
   ne coupe rien. */
.topbar:has(.nav-item.dropdown > .dropdown-menu.content-dd),
#main-wrapper:has(.nav-item.dropdown > .dropdown-menu.content-dd) .sticky-top,
#main-wrapper:has(.dropup > .dropdown-menu.content-dd) .sticky-top {
	transition: z-index 0s linear var(--mm-dropdown-veil-fade);
}

.topbar:has(.nav-item.dropdown:hover > .dropdown-menu.content-dd),
.topbar:has(.nav-item.dropdown > .dropdown-menu.content-dd.show) {
	z-index: var(--mm-dropdown-menu-z);
	transition: z-index 0s;
}

.dropdown-menu.content-dd {
	z-index: 1;
}

.dropdown-menu.content-dd.show,
.topbar .nav-item.dropdown:hover .dropdown-menu.content-dd,
.dropup:hover > .dropdown-menu.content-dd {
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.10), 0 24px 60px -16px rgba(15, 23, 42, 0.45) !important;
}

/* Bootstrap .sticky-top sur <thead> = z-index 1020 > topbar (50) : repasse
   au-dessus du voile. On le rabaisse le temps de l'ouverture, avec le même
   retour différé que la topbar (déclaré plus haut). */
#main-wrapper:has(.topbar .nav-item.dropdown:hover > .dropdown-menu.content-dd) .sticky-top,
#main-wrapper:has(.nav-item.dropdown > .dropdown-menu.content-dd.show) .sticky-top,
#main-wrapper:has(.dropup:hover > .dropdown-menu.content-dd) .sticky-top,
#main-wrapper:has(.dropup > .dropdown-menu.content-dd.show) .sticky-top {
	z-index: 0 !important;
	transition: z-index 0s;
}

/* Le picker natif (appearance: base-select) est dans le top layer du
   navigateur : il se peint au-dessus du voile, z-index ignoré. On le
   retire tant que le voile est là. Le JS ferme le select, sinon le
   panneau reviendrait net à la sortie du survol. */
body:has(.topbar .nav-item.dropdown:hover > .dropdown-menu.content-dd) ::picker(select),
body:has(.nav-item.dropdown > .dropdown-menu.content-dd.show) ::picker(select),
body:has(.dropup:hover > .dropdown-menu.content-dd) ::picker(select),
body:has(.dropup > .dropdown-menu.content-dd.show) ::picker(select) {
	display: none !important;
}

/* Un seul token à annuler : le voile devient instantané, et le délai de retour
   des z-index tombe avec lui — sinon la sidebar resterait sombre après coup. */
@media (prefers-reduced-motion: reduce) {
	:root {
		--mm-dropdown-veil-fade: 0s;
	}
}

/* ===================================================================
   Modales — dropdowns plugin (selectize, country-input) non clippés
   Selectize : dropdownParent body (JS input_selectize) + z-index.
   Country-input : porté dans un hôte .country-select sur body (JS
   mmModalDropdowns) + repli CSS :has().
   =================================================================== */
body > .selectize-dropdown,
.selectize-dropdown.mm-selectize-modal-dropdown {
	z-index: 1060 !important;
}

/* Hôte du dropdown country-input porté sur body : garde .country-select
   (styles scopés du plugin) ; top/left/width/position posés en inline par le JS. */
.mm-country-portal-host {
	position: fixed;
	z-index: 1060;
	margin: 0;
	padding: 0;
}

.mm-country-portal-host > .country-select-dropdown.mm-country-dropdown-portal,
.mm-country-portal-host > .country-list.mm-country-dropdown-portal {
	position: static !important;
	top: auto !important;
	left: auto !important;
	margin: 0 !important;
	width: 100% !important;
}

/* clickInput() du plugin peut poser width:0 inline sur la liste (mesure pendant l'anim
   de la modale) ; en mode porté la liste n'est plus sous son .country-select d'origine,
   on garantit donc sa largeur ici. */
.mm-country-portal-host .country-list {
	width: auto !important;
}

.mm-country-portal-host .country-select-search-wrap {
	cursor: text;
}

.modal.show .modal-dialog:has(.selectize-control.dropdown-active),
.modal.show .modal-content:has(.selectize-control.dropdown-active),
.modal.show .modal-body:has(.selectize-control.dropdown-active),
.modal.show .modal-dialog:has(.country-select-dropdown:not(.hide)),
.modal.show .modal-content:has(.country-select-dropdown:not(.hide)),
.modal.show .modal-body:has(.country-select-dropdown:not(.hide)) {
	overflow: visible;
}

/* ===================================================================
   Marque Maestra — logo du mini-panel latéral et de l'offcanvas mobile.
   Flat : pas d'ombre ni de dégradé, la seule réaction au survol est un
   léger fondu.

   Le SVG est portrait (775×968) : on pilote la hauteur, la largeur suit.
   width/height sont aussi posés sur la balise <img> pour réserver la place
   avant le décodage (pas de saut de mise en page au chargement).
   =================================================================== */
.brand-logo .brand-logo__mark,
.offcanvas-header .brand-logo__mark {
	display: block;
	height: 36px;
	width: auto;
	transition: opacity 0.15s linear;
}

.brand-logo__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.brand-logo__link:hover .brand-logo__mark {
	opacity: 0.7;
}

.brand-logo__link:focus-visible {
	outline: 2px solid var(--bs-primary, #00a1ff);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	.brand-logo .brand-logo__mark,
	.offcanvas-header .brand-logo__mark {
		transition: none;
	}
}

/* ===================================================================
   Preloader — voile de chargement plein écran.

   Le markup <div class="preloader"><img class="lds-ripple"/></div> est répété
   à l'identique dans ~150 templates (Maestra + plugins) : on le rehabille ici
   une seule fois plutôt que de toucher chaque fichier. Le visuel favicon
   d'origine est masqué.

   Le lockup mélange pseudo-éléments et vraies balises : ::before pour le logo,
   l'<img> favicon recyclé en anneau de chargement, puis .preloader__name et
   .preloader__legal, deux <span> greffés par pageBuilder::completeLoaderVeil()
   — les pseudo-éléments ne suffisaient plus à quatre éléments aux styles
   distincts. Le logo occupe sa propre boîte parce que sa lévitation doit passer
   par `translate`, composé sur le GPU ; portée par la position du fond d'un
   élément partagé avec du texte, elle se quantifiait au pixel écran et
   saccadait.

   La géométrie dérive des variables ci-dessous : changer la taille du logo ou
   des lignes de texte réaligne l'anneau tout seul.

   Apparition retardée (300 ms) : un chargement court ne doit pas flasher le
   voile. pageBuilder::completeLoaderVeil() pose display:none dès la fin du HTML,
   avant les bundles JS (theme.js le refait au DOMContentLoaded, trop tard seul :
   le voile clignotait à chaque navigation). Si ce masquage arrive avant la fin du
   délai, l'animation n'a jamais le temps de se voir.

   Flat : aucun dégradé, aucune ombre portée.
   =================================================================== */
.preloader {
	--mm-logo-size: 9rem;
	--mm-lockup-gap: 3.75rem; /* assez large pour que l'anneau retombe au-dessus du wordmark */
	--mm-name-size: 1.75rem;
	--mm-legal-gap: 0.75rem;
	--mm-legal-size: 0.75rem;
	--mm-ring-size: 13rem;
	--mm-preloader-delay: .3s;

	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	left: 0;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	animation: mmPreloaderReveal .22s ease var(--mm-preloader-delay) forwards;
}

/* Anneau de chargement autour du logo.

   L'<img> favicon est vidé par object-position : le bitmap est repoussé hors de
   sa content box, donc clippé, et il ne reste que la bordure. content:"" et
   content:url() laissent le bitmap visible dans Chromium, contrairement à ça.

   Le décalage vertical recentre l'anneau sur le logo seul : le lockup est
   centré à l'écran, or son logo est plus haut que son centre de la moitié de
   tout ce qui le suit. La lévitation étant symétrique, elle n'entre pas dans le
   calcul : l'anneau reste centré sur la position moyenne du logo.

   Enrichissement : l'arc court sur 180° en deux intensités pleines (traîne à
   35%) — deux segments francs plutôt qu'un dégradé — et un filet concentrique
   d'1px double l'anneau à 8px. Ce filet est un box-shadow dont la première
   couche, à la couleur du fond, masque l'intérieur de la seconde : c'est un
   cercle plat, pas une ombre portée. */
.preloader .lds-ripple {
	display: block;
	position: absolute;
	top: calc(
		50% - (var(--mm-lockup-gap) + var(--mm-name-size) + var(--mm-legal-gap) + var(--mm-legal-size)) / 2
	);
	right: auto;
	bottom: auto;
	left: 50%;
	width: var(--mm-ring-size);
	height: var(--mm-ring-size);
	margin: calc(var(--mm-ring-size) / -2) 0 0 calc(var(--mm-ring-size) / -2);
	object-fit: none;
	object-position: -9999px -9999px;
	border: 2px solid var(--bs-border-color, #dfe5ef);
	border-top-color: var(--bs-primary, #00a1ff);
	border-right-color: color-mix(in srgb, var(--bs-primary, #00a1ff) 35%, transparent);
	border-radius: 50%;
	box-shadow:
		0 0 0 0.5rem var(--bs-body-bg, #f6f9fc),
		0 0 0 calc(0.5rem + 1px) color-mix(in srgb, var(--bs-border-color, #dfe5ef) 65%, transparent);
	animation: mmPreloaderSpin 1.3s linear infinite;
}

/* Logo, seul élément animé du lockup. */
.preloader::before {
	content: "";
	display: block;
	width: var(--mm-logo-size);
	height: var(--mm-logo-size);
	margin-bottom: var(--mm-lockup-gap);
	background-image: url(../../../img/svg/logos/logo-maestra-2026.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	animation: mmPreloaderFloat 3.2s ease-in-out infinite;
}

/* Wordmark et mention légale, immobiles sous le logo. line-height:1 fait
   coïncider la hauteur de chaque ligne avec sa variable, dont dépend le
   placement de l'anneau. */
.preloader__name {
	font-size: var(--mm-name-size);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1;
	text-align: center;
	color: var(--bs-heading-color, #111c2d);
}

.preloader__legal {
	margin-top: var(--mm-legal-gap);
	font-size: var(--mm-legal-size);
	font-weight: 500;
	letter-spacing: 0.02em;
	line-height: 1;
	text-align: center;
	color: var(--bs-secondary-color, #5a6a85);
}

[data-bs-theme='dark'] .preloader__name {
	color: #ffffff;
}

@keyframes mmPreloaderSpin {
	to {
		rotate: 360deg;
	}
}

@keyframes mmPreloaderFloat {
	0%,
	100% {
		translate: 0 0.375rem;
	}

	50% {
		translate: 0 -0.375rem;
	}
}

@keyframes mmPreloaderReveal {
	to {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
	}
}

@media (max-width: 575.98px) {
	.preloader {
		--mm-logo-size: 6.75rem;
		--mm-name-size: 1.5rem;
		--mm-ring-size: 10rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.preloader {
		animation-duration: .01s;
	}
	.preloader .lds-ripple,
	.preloader::before {
		animation: none;
	}
}

/* ===================================================================
   Rail latéral — bascule light/dark sans fondu de la bordure.

   vendor/styles.css pose `transition: all .4s` sur .side-mini-panel alors
   que seul le slide (left en LTR, right en RTL) a besoin d'être animé.
   Avec `all`, le changement de --bs-border-color au switch de thème est
   animé aussi : le trait clair du border-right persiste 400 ms sur une
   page déjà sombre. On restreint donc la transition au déplacement.
   =================================================================== */
.side-mini-panel {
	transition-property: left, right;
}


/* ===================================================================
   Menu vertical admin : rail d'icônes + panneau de section, version épurée.

   Surcouche du vendor (styles.css) : même gabarit (rail 80 px, panneau
   240 px, classes .selected / .active / .d-block posées par le serveur
   (pageBuilder::markAdminMenuActive) puis reprises par sidebarmenu.js),
   rien ne bouge dans le layout. On remplace les pastilles rondes par des
   carrés arrondis, on ajoute un témoin d'actif sur le bord du rail, on
   allège les séparateurs et on hiérarchise le panneau par la typographie.
   =================================================================== */
.side-mini-panel {
	--mm-nav-line: color-mix(in srgb, var(--bs-body-color) 8%, transparent);
	--mm-nav-muted: color-mix(in srgb, var(--bs-body-color) 58%, transparent);
	--mm-nav-hover: color-mix(in srgb, var(--bs-body-color) 5%, transparent);
	--mm-nav-active-bg: color-mix(in srgb, var(--bs-primary) 11%, transparent);
	--mm-nav-radius: 12px;
	border-right-color: var(--mm-nav-line);
}

[data-bs-theme="dark"] .side-mini-panel {
	--mm-nav-hover: color-mix(in srgb, #fff 6%, transparent);
	--mm-nav-active-bg: color-mix(in srgb, var(--bs-primary) 18%, transparent);
}

/* --- Icônes Iconify : la place est réservée avant que le composant soit défini.
   Sans ça, <iconify-icon> fait 0 px tant que son script (bas de page) n'est pas
   passé, puis 1em : le texte des liens glisse à chaque chargement. */
iconify-icon {
	display: inline-block;
	width: 1em;
	height: 1em;
}

/* --- Rail : logo */
.side-mini-panel .mini-nav .brand-logo {
	min-height: 72px;
	padding: 0;
	margin: 0 16px 10px;
	border-bottom: 1px solid var(--mm-nav-line);
}

.side-mini-panel .mini-nav ul.mini-nav-ul {
	height: calc(100vh - 82px);
	padding-top: 2px;
}

/* --- Rail : entrées */
.side-mini-panel .mini-nav .mini-nav-item > a {
	height: 46px;
	margin-bottom: 6px;
}

.side-mini-panel .mini-nav .mini-nav-item > a iconify-icon {
	color: var(--mm-nav-muted);
	transition: color 0.15s ease, transform 0.15s ease;
}

.side-mini-panel .mini-nav .mini-nav-item > a::before {
	content: "";
	position: absolute;
	top: 1px;
	left: 0;
	right: 0;
	width: 44px;
	height: 44px;
	margin: 0 auto;
	border-radius: var(--mm-nav-radius);
	background: transparent;
	z-index: 1;
	transition: background-color 0.15s ease;
}

.side-mini-panel .mini-nav .mini-nav-item > a:hover::before {
	background: var(--mm-nav-hover);
	width: 44px;
	height: 44px;
	top: 1px;
	border-radius: var(--mm-nav-radius);
}

.side-mini-panel .mini-nav .mini-nav-item > a:hover iconify-icon {
	color: var(--bs-body-color);
}

.side-mini-panel .mini-nav .mini-nav-item.selected > a::before {
	background: var(--mm-nav-active-bg);
	width: 44px;
	height: 44px;
	top: 1px;
	border-radius: var(--mm-nav-radius);
}

.side-mini-panel .mini-nav .mini-nav-item.selected > a iconify-icon {
	color: var(--bs-primary);
}

/* Témoin d'actif : trait collé au bord gauche du rail */
.side-mini-panel .mini-nav .mini-nav-item > a::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 3px;
	height: 0;
	border-radius: 0 3px 3px 0;
	background: var(--bs-primary);
	transform: translateY(-50%);
	transition: height 0.2s ease;
	z-index: 2;
}

.side-mini-panel .mini-nav .mini-nav-item.selected > a::after {
	height: 22px;
}

.side-mini-panel .mini-nav .mini-nav-item > a:focus-visible {
	outline: none;
}

.side-mini-panel .mini-nav .mini-nav-item > a:focus-visible::before {
	box-shadow: 0 0 0 2px var(--bs-primary);
}

/* --- Séparateurs pointillés : retirés (le rail et le panneau se suffisent) */
.side-mini-panel .sidebar-divider {
	display: none;
}

/* --- Panneau de section */
.side-mini-panel .sidebarmenu .sidebar-nav {
	padding: 22px 14px;
	border-right: 1px solid var(--mm-nav-line);
	box-shadow: none;
}

/* Titre de la section : premier libellé du panneau */
.side-mini-panel .sidebar-nav .nav-small-cap {
	padding: 4px 12px 8px;
	font-size: 11px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--mm-nav-muted);
}

.side-mini-panel .sidebar-nav .sidebar-menu > .nav-small-cap:first-child {
	display: flex;
	align-items: center;
	height: 50px;
	margin-bottom: 14px;
	padding: 0 12px;
	border-bottom: 1px solid var(--mm-nav-line);
	font-size: 15px;
	font-weight: 650;
	letter-spacing: -0.01em;
	text-transform: none;
	color: var(--bs-heading-color, var(--bs-body-color));
}

/* Liens */
.side-mini-panel .sidebar-nav ul .sidebar-item .sidebar-link {
	gap: 12px;
	padding: 8px 12px;
	margin-bottom: 2px;
	border-radius: 10px;
	font-size: 14px;
	font-weight: 500;
	line-height: 22px;
	color: color-mix(in srgb, var(--bs-body-color) 82%, transparent);
	transition: background-color 0.15s ease, color 0.15s ease;
}

.side-mini-panel .sidebar-nav ul .sidebar-item .sidebar-link iconify-icon,
.side-mini-panel .sidebar-nav ul .sidebar-item .sidebar-link > .mm-icon {
	flex: 0 0 auto;
	font-size: 18px;
	color: var(--mm-nav-muted);
	transition: color 0.15s ease;
}

.side-mini-panel .sidebar-nav ul .sidebar-item .sidebar-link:hover {
	background-color: var(--mm-nav-hover);
	color: var(--bs-body-color);
}

.side-mini-panel .sidebar-nav ul .sidebar-item .sidebar-link:hover iconify-icon,
.side-mini-panel .sidebar-nav ul .sidebar-item .sidebar-link:hover > .mm-icon {
	color: var(--bs-body-color);
}

.side-mini-panel .sidebar-nav ul .sidebar-item.selected > .sidebar-link,
.side-mini-panel .sidebar-nav ul .sidebar-item.selected > .sidebar-link.active,
.side-mini-panel .sidebar-nav ul .sidebar-item > .sidebar-link.active {
	background-color: var(--mm-nav-active-bg);
	color: var(--bs-primary);
	font-weight: 600;
}

.side-mini-panel .sidebar-nav ul .sidebar-item.selected > .sidebar-link iconify-icon,
.side-mini-panel .sidebar-nav ul .sidebar-item > .sidebar-link.active iconify-icon,
.side-mini-panel .sidebar-nav ul .sidebar-item.selected > .sidebar-link > .mm-icon,
.side-mini-panel .sidebar-nav ul .sidebar-item > .sidebar-link.active > .mm-icon {
	color: var(--bs-primary);
}

.side-mini-panel .sidebar-nav ul .sidebar-item .sidebar-link:focus-visible {
	outline: 2px solid var(--bs-primary);
	outline-offset: -2px;
}

@media (prefers-reduced-motion: reduce) {
	.side-mini-panel .mini-nav .mini-nav-item > a iconify-icon,
	.side-mini-panel .mini-nav .mini-nav-item > a::before,
	.side-mini-panel .mini-nav .mini-nav-item > a::after,
	.side-mini-panel .sidebar-nav ul .sidebar-item .sidebar-link,
	.side-mini-panel .sidebar-nav ul .sidebar-item .sidebar-link iconify-icon {
		transition: none;
	}
}

/* --- Copyright discret en bas à droite de toutes les pages admin (posé après le header) */
.mm-admin-copyright {
	position: fixed;
	right: 1rem;
	bottom: 0.625rem;
	z-index: 1;
	margin: 0;
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.02em;
	color: var(--bs-secondary-color, #5a6a85);
	opacity: 0.6;
	transition: opacity 0.15s linear;
}

.mm-admin-copyright:hover,
.mm-admin-copyright:focus-within {
	opacity: 1;
}

.mm-admin-copyright a {
	color: inherit;
	text-decoration: none;
	transition: color 0.15s linear;
}

.mm-admin-copyright a:hover,
.mm-admin-copyright a:focus-visible {
	color: var(--bs-primary, #00a1ff);
}

@media print {
	.mm-admin-copyright {
		display: none;
	}
}