/* =====================================================================
   EuroDatas — Modern UI Layer
   Couche de design contemporaine appliquée par-dessus le thème existant.
   Chargée en dernier : elle redéfinit l'apparence sans toucher au balisage
   fonctionnel (Bootstrap 5.3, DataTables 1.10, Select2, TinyMCE).
   ===================================================================== */

/* ------------------------------------------------------------------
   1. Design tokens
   ------------------------------------------------------------------ */
:root {
	/* Marque */
	--ed-brand-50:  #eef3ff;
	--ed-brand-100: #dce6ff;
	--ed-brand-200: #bccdff;
	--ed-brand-300: #92aaff;
	--ed-brand-400: #6480f8;
	--ed-brand-500: #3f5be8;
	--ed-brand-600: #2a45d4;
	--ed-brand-700: #1f36ac;
	--ed-brand-800: #1c2f88;
	--ed-brand-900: #1a2b6d;

	--ed-primary: #2a45d4;
	--ed-primary-hover: #1f36ac;
	--ed-primary-soft: #eef3ff;
	--ed-primary-contrast: #ffffff;

	/* Sémantique */
	--ed-success: #10a37f;
	--ed-success-soft: #e6f7f2;
	--ed-warning: #d97706;
	--ed-warning-soft: #fef4e6;
	--ed-danger: #e11d48;
	--ed-danger-soft: #fdeaef;
	--ed-info: #0ea5e9;
	--ed-info-soft: #e6f6fe;

	/* Surfaces */
	--ed-canvas: #f5f6fa;
	--ed-surface: #ffffff;
	--ed-surface-2: #fafbfd;
	--ed-surface-3: #f2f4f8;
	--ed-sidebar: #ffffff;
	--ed-topbar: rgba(255, 255, 255, .82);

	/* Bordures */
	--ed-border: #e6e9f0;
	--ed-border-strong: #d5dae5;

	/* Texte */
	--ed-text: #101728;
	--ed-text-soft: #56607a;
	--ed-text-muted: #8892a8;
	--ed-text-invert: #ffffff;

	/* Rayons */
	--ed-r-xs: 6px;
	--ed-r-sm: 8px;
	--ed-r-md: 10px;
	--ed-r-lg: 14px;
	--ed-r-xl: 18px;
	--ed-r-pill: 999px;

	/* Ombres */
	--ed-shadow-xs: 0 1px 2px rgba(16, 23, 40, .05);
	--ed-shadow-sm: 0 1px 3px rgba(16, 23, 40, .06), 0 1px 2px rgba(16, 23, 40, .04);
	--ed-shadow-md: 0 4px 12px -2px rgba(16, 23, 40, .08), 0 2px 4px -2px rgba(16, 23, 40, .04);
	--ed-shadow-lg: 0 12px 32px -8px rgba(16, 23, 40, .14), 0 4px 10px -4px rgba(16, 23, 40, .06);
	--ed-shadow-xl: 0 24px 56px -12px rgba(16, 23, 40, .2);
	--ed-ring: 0 0 0 3px rgba(42, 69, 212, .16);
	--ed-tooltip-bg: #0f172a;
	--ed-tooltip-color: #ffffff;

	/* Teintes d'identité des actions de ligne — même intensité, aucune hiérarchie */
	--ed-cyan: #0b7f9e;
	--ed-cyan-soft: #e3f4f9;
	--ed-violet: #7038d8;
	--ed-violet-soft: #f2ecfd;
	--ed-slate: #5a6579;
	--ed-slate-soft: #eef0f4;

	/* Métriques de layout */
	--ed-sidebar-w: 268px;
	--ed-sidebar-mini-w: 78px;
	--ed-topbar-h: 66px;

	/* Typographie */
	--ed-font: "Inter", "Inter var", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--ed-font-mono: "JetBrains Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;

	--ed-ease: cubic-bezier(.4, 0, .2, 1);
}

body.dark-skin {
	--ed-primary: #6480f8;
	--ed-primary-hover: #7b93ff;
	--ed-primary-soft: rgba(100, 128, 248, .14);
	--ed-primary-contrast: #0b0f1a;

	--ed-success: #34d3a6;
	--ed-success-soft: rgba(52, 211, 166, .14);
	--ed-warning: #f0a742;
	--ed-warning-soft: rgba(240, 167, 66, .14);
	--ed-danger: #fb7185;
	--ed-danger-soft: rgba(251, 113, 133, .14);
	--ed-info: #38bdf8;
	--ed-info-soft: rgba(56, 189, 248, .14);

	--ed-canvas: #0b0f1a;
	--ed-surface: #131a2a;
	--ed-surface-2: #172033;
	--ed-surface-3: #1d2740;
	--ed-sidebar: #101725;
	--ed-topbar: rgba(16, 23, 37, .84);

	--ed-border: #253150;
	--ed-border-strong: #33436b;

	--ed-text: #e8ecf6;
	--ed-text-soft: #a9b4cc;
	--ed-text-muted: #7f8ba8;
	--ed-text-invert: #0b0f1a;

	--ed-shadow-xs: 0 1px 2px rgba(0, 0, 0, .4);
	--ed-shadow-sm: 0 1px 3px rgba(0, 0, 0, .45);
	--ed-shadow-md: 0 4px 14px -2px rgba(0, 0, 0, .5);
	--ed-shadow-lg: 0 14px 34px -10px rgba(0, 0, 0, .6);
	--ed-shadow-xl: 0 26px 60px -14px rgba(0, 0, 0, .7);
	--ed-ring: 0 0 0 3px rgba(100, 128, 248, .22);
	--ed-tooltip-bg: #2b3550;
	--ed-tooltip-color: #f2f5fc;

	--ed-cyan: #4cc7e8;
	--ed-cyan-soft: rgba(76, 199, 232, .16);
	--ed-violet: #b79cfb;
	--ed-violet-soft: rgba(183, 156, 251, .16);
	--ed-slate: #9aa6bd;
	--ed-slate-soft: rgba(154, 166, 189, .14);
}

/* Alignement des variables Bootstrap sur la marque */
:root {
	--bs-primary: #2a45d4;
	--bs-primary-rgb: 42, 69, 212;
	--bs-link-color: var(--ed-primary);
	--bs-link-hover-color: var(--ed-primary-hover);
	--bs-border-radius: var(--ed-r-md);
	--bs-body-font-family: var(--ed-font);
}

/* ------------------------------------------------------------------
   2. Base & typographie
   ------------------------------------------------------------------ */
html { font-size: 14px; }

body,
body.light-skin,
body.dark-skin {
	font-family: var(--ed-font);
	font-size: .975rem;
	line-height: 1.55;
	color: var(--ed-text);
	background-color: var(--ed-canvas);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-feature-settings: "cv02", "cv03", "cv04", "cv11";
	letter-spacing: -.005em;
}

body.dark-skin .wrapper,
body.light-skin .wrapper { background: transparent; }

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
	font-family: var(--ed-font);
	color: var(--ed-text);
	font-weight: 650;
	letter-spacing: -.018em;
	line-height: 1.3;
}

h1, .h1 { font-size: 1.85rem; }
h2, .h2 { font-size: 1.55rem; }
h3, .h3 { font-size: 1.3rem; }
h4, .h4 { font-size: 1.12rem; }
h5, .h5 { font-size: 1rem; }
h6, .h6 { font-size: .9rem; }

a { color: var(--ed-primary); text-decoration: none; transition: color .15s var(--ed-ease); }
a:hover, a:focus, a:active { color: var(--ed-primary-hover); text-decoration: none; }

small, .small { font-size: .82rem; }
code, kbd, pre, samp { font-family: var(--ed-font-mono); }

hr {
	border: 0;
	border-top: 1px solid var(--ed-border);
	opacity: 1;
	margin: 1.25rem 0;
}

::selection { background: var(--ed-primary-soft); color: var(--ed-text); }

/* Barres de défilement discrètes */
* { scrollbar-width: thin; scrollbar-color: var(--ed-border-strong) transparent; }
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
	background: var(--ed-border-strong);
	border-radius: var(--ed-r-pill);
	border: 2px solid transparent;
	background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background: var(--ed-text-muted); background-clip: content-box; }

/* Couleurs utilitaires réalignées */
.text-primary { color: var(--ed-primary) !important; }
.text-success { color: var(--ed-success) !important; }
.text-danger  { color: var(--ed-danger) !important; }
.text-warning { color: var(--ed-warning) !important; }
.text-info    { color: var(--ed-info) !important; }
.text-muted   { color: var(--ed-text-muted) !important; }
.text-grey    { color: var(--ed-text-muted) !important; }

/* ------------------------------------------------------------------
   3. Layout général
   ------------------------------------------------------------------ */
.wrapper { background: var(--ed-canvas); }

.content-wrapper {
	background: transparent !important;
	margin-left: var(--ed-sidebar-w) !important;
	margin-right: 0 !important;
	padding: calc(var(--ed-topbar-h) + 1.25rem) 1rem 2rem;
	min-height: 100vh;
	overflow: visible;
	transition: margin-left .28s var(--ed-ease);
}

.fixed .content-wrapper { padding-top: calc(var(--ed-topbar-h) + 1.25rem); }

/* Le conteneur conserve les gouttières Bootstrap pour compenser
   les marges négatives des .row (sinon débordement horizontal). */
.container-full { padding: 0 .75rem; max-width: 100%; width: 100%; }
.container-full .container-full { padding-left: 0; padding-right: 0; }
.content-wrapper > .container-full > .content { padding: 0; }
section.content { padding: 0; }

/* Sidebar repliée */
@media (min-width: 768px) {
	.sidebar-mini.sidebar-collapse .content-wrapper,
	.sidebar-mini.sidebar-collapse .right-side {
		margin-left: var(--ed-sidebar-mini-w) !important;
	}
}

@media (max-width: 767px) {
	.content-wrapper { margin-left: 0 !important; padding: calc(var(--ed-topbar-h) + 1rem) .35rem 1.5rem; }
	.sidebar-mini.sidebar-collapse .content-wrapper { margin-left: 0 !important; }
}

/* ------------------------------------------------------------------
   4. Barre supérieure
   ------------------------------------------------------------------ */
.main-header {
	max-height: none;
	height: var(--ed-topbar-h);
	z-index: 1030;
}

.fixed .main-header { position: fixed; top: 0; left: 0; right: 0; }

.main-header div.logo-box {
	width: var(--ed-sidebar-w);
	height: var(--ed-topbar-h);
	background: var(--ed-sidebar) !important;
	border-right: 1px solid var(--ed-border) !important;
	border-bottom: 1px solid var(--ed-border) !important;
	border-radius: 0;
	padding: 0 1.15rem;
	transition: width .28s var(--ed-ease);
}

.main-header .logo {
	display: flex;
	align-items: center;
	height: var(--ed-topbar-h);
	padding: 0;
	background: transparent !important;
}

.main-header .logo img { max-height: 34px; width: auto; }
.main-header .logo .logo-mini img { max-height: 30px; }

.main-header .navbar {
	background: var(--ed-topbar) !important;
	-webkit-backdrop-filter: saturate(180%) blur(14px);
	backdrop-filter: saturate(180%) blur(14px);
	margin-left: var(--ed-sidebar-w);
	min-height: var(--ed-topbar-h);
	height: var(--ed-topbar-h);
	padding: 0 1.25rem;
	border-bottom: 1px solid var(--ed-border) !important;
	box-shadow: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	transition: margin-left .28s var(--ed-ease);
}

@media (min-width: 768px) {
	.sidebar-mini.sidebar-collapse .main-header div.logo-box { width: var(--ed-sidebar-mini-w); }
	.sidebar-mini.sidebar-collapse .main-header .navbar { margin-left: var(--ed-sidebar-mini-w); }
}

/* Boutons icônes de la barre */
.main-header .push-btn,
.main-header .full-screen,
.main-header .svg-bt-icon,
.main-header .navbar-nav > li > a.nav-link,
.main-header .navbar-nav > li > a.dropdown-toggle {
	height: 40px;
	width: 40px;
	min-width: 40px;
	padding: 0;
	margin: 0 2px;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	border-radius: var(--ed-r-md);
	color: var(--ed-text-soft);
	background: transparent;
	border: 1px solid transparent;
	transition: background-color .15s var(--ed-ease), border-color .15s var(--ed-ease), color .15s var(--ed-ease);
}

.main-header .push-btn:hover,
.main-header .full-screen:hover,
.main-header .navbar-nav > li > a.nav-link:hover,
.main-header .navbar-nav > li > a.dropdown-toggle:hover {
	background-color: var(--ed-surface-3) !important;
	border-color: var(--ed-border);
	color: var(--ed-primary) !important;
}

.main-header .push-btn img,
.main-header .full-screen img,
.main-header .navbar-nav img.svg-icon {
	height: 19px;
	width: 19px;
	margin: 0;
	opacity: .78;
}

/* Les icônes de la barre supérieure sont des glyphes : elles suivent la
   couleur du texte et restent lisibles dans les deux thèmes, sans filtre. */
.main-header .push-btn > i,
.main-header .full-screen > i,
.main-header .navbar-nav > li > a > i:not(.ed-chevron),
.main-header .app-menu > ul.nav > li > a > i {
	font-size: 1.05rem;
	line-height: 1;
	color: var(--ed-text-soft);
	filter: none !important;
	transition: color .15s var(--ed-ease);
}

.main-header .push-btn:hover > i,
.main-header .full-screen:hover > i,
.main-header .navbar-nav > li > a:hover > i:not(.ed-chevron),
.main-header .app-menu > ul.nav > li > a:hover > i { color: var(--ed-primary); }

body.dark-skin .main-header img.svg-icon,
body.dark-skin .sidebar img.svg-icon { filter: invert(1) hue-rotate(180deg) brightness(1.15); }

.main-header .navbar-nav > li > a.dropdown-toggle::after { display: none; }

/* Recherche globale */
.ed-topbar-search {
	position: relative;
	min-width: 230px;
	max-width: 340px;
	flex: 1 1 260px;
}

.ed-topbar-search input {
	width: 100%;
	height: 40px;
	border-radius: var(--ed-r-md);
	border: 1px solid var(--ed-border);
	background: var(--ed-surface-3);
	color: var(--ed-text);
	padding: 0 .9rem 0 2.4rem;
	font-size: .9rem;
	transition: border-color .15s var(--ed-ease), box-shadow .15s var(--ed-ease), background-color .15s var(--ed-ease);
}

.ed-topbar-search input::placeholder { color: var(--ed-text-muted); }

.ed-topbar-search input:focus {
	outline: 0;
	background: var(--ed-surface);
	border-color: var(--ed-primary);
	box-shadow: var(--ed-ring);
}

.ed-topbar-search .ed-search-icon {
	position: absolute;
	left: .8rem;
	top: 50%;
	transform: translateY(-50%);
	color: var(--ed-text-muted);
	font-size: .85rem;
	pointer-events: none;
}

/* Pastille utilisateur */
.ed-user-chip {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	height: 40px;
	padding: 0 .35rem 0 .35rem;
	border-radius: var(--ed-r-pill);
	border: 1px solid var(--ed-border);
	background: var(--ed-surface);
	color: var(--ed-text) !important;
	transition: box-shadow .15s var(--ed-ease), border-color .15s var(--ed-ease);
}

.ed-user-chip:hover { border-color: var(--ed-border-strong); box-shadow: var(--ed-shadow-sm); }
.ed-user-chip img { height: 30px; width: 30px; border-radius: 50%; object-fit: cover; }
.ed-user-chip .ed-user-meta { display: flex; flex-direction: column; text-align: left; }
.ed-user-chip .ed-user-name { font-size: .875rem; font-weight: 600; line-height: 1.2; }
.ed-user-chip .ed-user-role { font-size: .72rem; color: var(--ed-text-muted); line-height: 1.1; }
.ed-user-chip .ed-chevron { font-size: .7rem; color: var(--ed-text-muted); margin-right: .45rem; }

@media (max-width: 767px) {
	.ed-user-chip .ed-user-meta, .ed-user-chip .ed-chevron { display: none; }
	.ed-user-chip { padding-right: .35rem; }
	.ed-topbar-search { display: none; }
}

/* Menus déroulants */
.dropdown-menu {
	border: 1px solid var(--ed-border) !important;
	border-radius: var(--ed-r-lg) !important;
	box-shadow: var(--ed-shadow-lg) !important;
	background: var(--ed-surface) !important;
	padding: .4rem !important;
	min-width: 220px;
	color: var(--ed-text);
}

.dropdown-menu .dropdown-item {
	border-radius: var(--ed-r-sm);
	padding: .5rem .65rem;
	font-size: .9rem;
	font-weight: 500;
	color: var(--ed-text-soft);
	display: flex;
	align-items: center;
	gap: .6rem;
	transition: background-color .12s var(--ed-ease), color .12s var(--ed-ease);
}

.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus {
	background: var(--ed-surface-3);
	color: var(--ed-primary);
}

.dropdown-menu .dropdown-header {
	padding: .5rem .65rem .3rem;
	font-size: .7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--ed-text-muted);
}

.dropdown-divider { border-color: var(--ed-border); opacity: 1; margin: .35rem 0; }

/* ------------------------------------------------------------------
   5. Navigation latérale
   ------------------------------------------------------------------ */
.main-sidebar {
	width: var(--ed-sidebar-w);
	padding-top: var(--ed-topbar-h);
	background: var(--ed-sidebar) !important;
	border-right: 1px solid var(--ed-border);
	border-top-right-radius: 0;
	z-index: 1020;
	transition: width .28s var(--ed-ease), transform .28s var(--ed-ease);
}

/* Colonne en trois parties : la carte profil garde sa hauteur naturelle,
   la zone de navigation prend le reste et défile seule si le menu est long.
   Sans cela la zone de défilement faisait déjà toute la hauteur de l'écran
   et venait s'ajouter à la carte profil, débordant d'autant. */
.main-sidebar .sidebar {
	background: transparent !important;
	display: flex;
	flex-direction: column;
	height: calc(100vh - var(--ed-topbar-h));
}

.main-sidebar .multinav {
	background: transparent !important;
	/* Le thème le passe en `position: fixed` : il sortirait du flux et se
	   recalerait en haut de la colonne, par-dessus la carte profil. */
	position: relative !important;
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
	width: 100%;
	height: auto !important;
}

.main-sidebar .multinav-scroll {
	background: transparent !important;
	flex: 1 1 auto;
	min-height: 0;
	height: auto !important;
}

/* Carte profil */
.main-sidebar .user-profile {
	padding: 1rem .85rem !important;
	margin: 0;
}

.ed-profile-card {
	display: flex;
	align-items: center;
	gap: .7rem;
	padding: .65rem .7rem;
	border-radius: var(--ed-r-lg);
	background: var(--ed-surface-3);
	border: 1px solid var(--ed-border);
	overflow: hidden;
}

.ed-profile-card .avatar,
.ed-profile-card img {
	height: 40px !important;
	width: 40px !important;
	min-width: 40px;
	border-radius: 50% !important;
	object-fit: cover;
	border: 2px solid var(--ed-surface) !important;
	box-shadow: var(--ed-shadow-xs);
	margin: 0 !important;
}

.ed-profile-card .info { min-width: 0; }

.ed-profile-card .ed-profile-name {
	font-size: .9rem;
	font-weight: 650;
	color: var(--ed-text);
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.ed-profile-card .ed-profile-meta {
	font-size: .76rem;
	color: var(--ed-text-muted);
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Liste de navigation */
.sidebar-menu {
	padding: .25rem .65rem 1rem;
	overflow: visible;
}

.sidebar-menu > li {
	position: relative;
	padding: 0 !important;
	margin: 1px 0 !important;
	border-left: 0 !important;
}

.sidebar-menu > li > a,
.sidebar-menu .treeview-menu > li > a {
	display: flex !important;
	align-items: center;
	gap: .7rem;
	min-height: 42px;
	padding: .5rem .7rem !important;
	border-radius: var(--ed-r-md) !important;
	font-size: .9rem;
	font-weight: 550;
	color: var(--ed-text-soft) !important;
	background: transparent !important;
	transition: background-color .15s var(--ed-ease), color .15s var(--ed-ease);
	position: relative;
}

.sidebar-menu > li:hover > a { padding-left: .7rem !important; }

.sidebar-menu > li > a > i,
.sidebar-menu > li > a > .menu-icon,
.sidebar-menu .treeview-menu > li > a > i,
.sidebar-menu .treeview-menu > li > a > .menu-icon {
	width: 22px;
	min-width: 22px;
	margin: 0 !important;
	font-size: 1rem !important;
	line-height: 1;
	text-align: center;
	color: var(--ed-text-muted) !important;
	background: transparent !important;
	border: 0 !important;
	border-radius: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: color .15s var(--ed-ease);
}

.sidebar-menu > li > a > span,
.sidebar-menu .treeview-menu > li > a > span {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.sidebar-menu > li > a:hover,
.sidebar-menu .treeview-menu > li > a:hover {
	background: var(--ed-surface-3) !important;
	color: var(--ed-text) !important;
}

.sidebar-menu > li > a:hover > i,
.sidebar-menu > li > a:hover > .menu-icon,
.sidebar-menu .treeview-menu > li > a:hover > i,
.sidebar-menu .treeview-menu > li > a:hover > .menu-icon {
	color: var(--ed-primary) !important;
}

/* Etat actif */
.sidebar-menu > li.active > a,
.sidebar-menu > li > a.active,
.sidebar-menu .treeview-menu > li.active > a,
.sidebar-menu .treeview-menu > li > a.active {
	background: var(--ed-primary-soft) !important;
	color: var(--ed-primary) !important;
	font-weight: 650;
}

.sidebar-menu > li.active > a > i,
.sidebar-menu > li > a.active > i,
.sidebar-menu > li.active > a > .menu-icon,
.sidebar-menu > li > a.active > .menu-icon,
.sidebar-menu .treeview-menu > li.active > a > i,
.sidebar-menu .treeview-menu > li > a.active > i,
.sidebar-menu .treeview-menu > li.active > a > .menu-icon,
.sidebar-menu .treeview-menu > li > a.active > .menu-icon {
	color: var(--ed-primary) !important;
}

.sidebar-menu > li.active > a::before,
.sidebar-menu > li > a.active::before {
	content: "";
	position: absolute;
	left: -.65rem;
	top: 50%;
	transform: translateY(-50%);
	width: 3px;
	height: 20px;
	border-radius: 0 3px 3px 0;
	background: var(--ed-primary);
}

/* Groupes depliables */
.sidebar-menu > li.treeview > a > .fa-angle-left,
.sidebar-menu > li.treeview > a > .pull-right {
	margin-left: auto;
	font-size: .8rem;
	color: var(--ed-text-muted) !important;
	transition: transform .22s var(--ed-ease);
	float: none !important;
}

.sidebar-menu > li.treeview.menu-open > a > .fa-angle-left { transform: rotate(-90deg); }

.sidebar-menu > li.treeview.menu-open > a {
	color: var(--ed-text) !important;
	font-weight: 650;
}

.treeview-menu {
	padding: .15rem 0 .3rem 1.45rem !important;
	margin: 0 !important;
	background: transparent !important;
	position: relative;
}

.treeview-menu::before {
	content: "";
	position: absolute;
	left: .95rem;
	top: .25rem;
	bottom: .4rem;
	width: 1px;
	background: var(--ed-border);
}

.treeview-menu > li > a {
	min-height: 36px !important;
	font-size: .865rem !important;
	font-weight: 500;
	padding: .35rem .6rem !important;
}

/* Etiquette de section */
.sidebar-menu > li.ed-nav-label,
.ed-nav-label {
	list-style: none;
	padding: 1.15rem .75rem .4rem !important;
	margin: 0 !important;
	font-size: .68rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .09em;
	color: var(--ed-text-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	pointer-events: none;
}

.sidebar-menu > li.ed-nav-label:first-child { padding-top: .25rem !important; }

/* Pied de la navigation */
.sidebar-widgets { padding: 0 .65rem 1.25rem; }

.sidebar-widgets .copyright {
	margin: 0 !important;
	padding: .85rem .7rem 0;
	border-top: 1px solid var(--ed-border);
	font-size: .74rem;
	color: var(--ed-text-muted);
	line-height: 1.5;
}

.sidebar-widgets .copyright p { margin: 0; }

/* Rail replie */
@media (min-width: 768px) {
	.sidebar-mini.sidebar-collapse .main-sidebar { width: var(--ed-sidebar-mini-w); }
	.sidebar-mini.sidebar-collapse .sidebar-menu { padding-left: .7rem; padding-right: .7rem; }
	.sidebar-mini.sidebar-collapse .sidebar-menu > li { padding: 0 !important; }
	.sidebar-mini.sidebar-collapse .sidebar-menu > li > a {
		justify-content: center;
		padding: .5rem !important;
	}
	.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > i,
	.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .menu-icon { font-size: 1.1rem !important; }
	.sidebar-mini.sidebar-collapse .sidebar-menu > li.ed-nav-label {
		height: 1px;
		padding: 0 !important;
		margin: .55rem .3rem !important;
		overflow: hidden;
		text-indent: -999px;
		background: var(--ed-border);
	}
	.sidebar-mini.sidebar-collapse .main-sidebar .user-profile { padding: .8rem .55rem !important; }
	.sidebar-mini.sidebar-collapse .ed-profile-card {
		justify-content: center;
		padding: .35rem;
		background: transparent;
		border-color: transparent;
	}
	.sidebar-mini.sidebar-collapse .ed-profile-card .info { display: none; }
	.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a::before { display: none; }

	/* Menus volants */
	.sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right) {
		display: block !important;
		position: absolute;
		left: calc(var(--ed-sidebar-mini-w) - 8px);
		top: 0;
		width: 210px;
		margin: 0;
		padding: .6rem .9rem;
		text-align: left;
		border-radius: var(--ed-r-md);
		background: var(--ed-surface) !important;
		border: 1px solid var(--ed-border);
		box-shadow: var(--ed-shadow-lg);
		color: var(--ed-text);
		z-index: 1100;
	}
	.sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse .sidebar-menu > li.treeview:hover > a > span:not(.pull-right) { display: none !important; }
	.sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
		display: block !important;
		position: absolute;
		left: calc(var(--ed-sidebar-mini-w) - 8px);
		top: 0;
		width: 230px;
		padding: .4rem !important;
		border-radius: var(--ed-r-lg);
		background: var(--ed-surface) !important;
		border: 1px solid var(--ed-border);
		box-shadow: var(--ed-shadow-lg);
		z-index: 1100;
	}
	.sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse .sidebar-menu > li:hover > .treeview-menu::before { display: none; }
	.sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse .sidebar-menu > li:hover > .treeview-menu::after,
	.sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse .sidebar-menu > li:hover > a::after { display: none; }
	.sidebar-collapse .treeview-menu { margin-left: 0 !important; }
}

@media (max-width: 767px) {
	.main-sidebar {
		transform: translateX(-100%);
		width: var(--ed-sidebar-w);
		box-shadow: var(--ed-shadow-xl);
		z-index: 1045;
	}
	/* Deux classes : indispensable pour passer devant `body .main-sidebar`
	   défini plus bas, sinon le voile recouvre la navigation ouverte et
	   intercepte les clics sur les liens. */
	body.sidebar-open .main-sidebar { z-index: 1046; }
	/* Le thème pose ses propres transform/margin sur cette barre en mobile,
	   avec préfixes -webkit-. On impose les nôtres pour que l'ouverture
	   fonctionne et que la barre parte bien du haut de l'écran. */
	body.sidebar-open .main-sidebar,
	body.sidebar-mini.sidebar-open .main-sidebar {
		transform: translateX(0) !important;
		-webkit-transform: translateX(0) !important;
		width: var(--ed-sidebar-w);
	}
	.main-sidebar {
		margin-top: 0 !important;
		padding-top: var(--ed-topbar-h) !important;
	}
	/* Voile de fond quand la navigation est ouverte */
	body.sidebar-open::after {
		content: "";
		position: fixed;
		inset: 0;
		background: rgba(11, 18, 32, .45);
		z-index: 1040;
		animation: ed-fade-in .2s var(--ed-ease);
	}
	.main-header .navbar { margin-left: 0 !important; }
	.main-header div.logo-box {
		width: auto;
		min-width: 0;
		border-right: 0 !important;
		padding: 0 .75rem;
	}
	.main-header .logo .logo-lg img { max-height: 28px; }
	.content-header { padding-bottom: 1rem !important; }
	.content-header > h4, .content-header > .ed-page-title { font-size: 1.15rem; }
	.box-body, .card-body { padding: 1rem !important; }
	.modal-full { width: 100%; margin: .5rem auto; }
}

@keyframes ed-fade-in { from { opacity: 0; } to { opacity: 1; } }

/* ------------------------------------------------------------------
   6. En-tete de page et fil d'ariane
   ------------------------------------------------------------------ */
.content-header {
	position: relative;
	padding: 0 0 1.35rem !important;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: .75rem 1rem;
}

.content-header > h4,
.content-header > .ed-page-title {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .55rem;
	margin: 0;
	padding: 0 !important;
	font-size: 1.32rem;
	font-weight: 680;
	letter-spacing: -.02em;
	color: var(--ed-text);
}

.content-header > h4 > i:first-child,
.content-header > .ed-page-title > i:first-child {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: var(--ed-r-md);
	background: var(--ed-primary-soft);
	color: var(--ed-primary);
	font-size: .95rem !important;
}

.content-header > h4 > small { color: var(--ed-text-muted); font-weight: 400; }

/* Boutons d'action dans l'en-tete */
.content-header .btn,
.content-header .btn-xs {
	margin-left: .1rem;
}

/* Fil d'ariane */
.content-header .breadcrumb,
.breadcrumb {
	position: static !important;
	float: none !important;
	margin: 0 !important;
	padding: .38rem .8rem !important;
	background: var(--ed-surface) !important;
	border: 1px solid var(--ed-border);
	border-radius: var(--ed-r-pill) !important;
	font-size: .8rem;
	list-style: none;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .1rem;
	box-shadow: var(--ed-shadow-xs);
}

.breadcrumb > li { display: inline-flex; align-items: center; color: var(--ed-text-muted); }
.breadcrumb > li > a { color: var(--ed-text-muted); font-weight: 500; }
.breadcrumb > li > a:hover { color: var(--ed-primary); }
.breadcrumb > li.active { color: var(--ed-text); font-weight: 600; }
.breadcrumb > li i { margin-right: .3rem; font-size: .78rem; }

.breadcrumb > li + li::before {
	content: "";
	display: inline-block;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--ed-border-strong);
	margin: 0 .6rem;
	padding: 0 !important;
	color: transparent !important;
}

/* ------------------------------------------------------------------
   7. Cartes (.box)
   ------------------------------------------------------------------ */
.box,
.card {
	background: var(--ed-surface) !important;
	border: 1px solid var(--ed-border) !important;
	border-radius: var(--ed-r-lg) !important;
	box-shadow: var(--ed-shadow-sm) !important;
	margin-bottom: 1.25rem;
	overflow: hidden;
	transition: box-shadow .2s var(--ed-ease), border-color .2s var(--ed-ease);
}

.box:hover { box-shadow: var(--ed-shadow-md) !important; }

.box-header,
.card-header {
	background: transparent !important;
	padding: 1.1rem 1.25rem .85rem !important;
	border-bottom: 0 !important;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
}

.box-header.with-border { border-bottom: 1px solid var(--ed-border) !important; }

/* Le thème place ces contrôles en absolu à 1.5rem du haut de l'en-tête :
   la pastille dépassait donc sur le trait de séparation. On les remet dans
   le flux, l'en-tête reprend alors sa hauteur autour d'eux. */
.box-header > .box-controls {
	position: static !important;
	top: auto !important;
	right: auto !important;
	align-self: center;
	flex: 0 0 auto;
	margin-left: auto;
	float: none !important;
}

.box-header > .box-title,
.box-header > h4,
.card-header > h4 {
	/* Base zéro plutôt qu'auto : avec `flex-wrap: wrap`, un titre long
	   passerait à la ligne AVANT de se laisser réduire, et repousserait la
	   pastille en dessous. */
	flex: 1 1 0;
	min-width: 0;
	margin: 0 !important;
	font-size: 1rem;
	font-weight: 650;
	letter-spacing: -.01em;
	color: var(--ed-text);
	line-height: 1.4;
}

.box-header .box-subtitle,
.box-header p { font-size: .84rem; color: var(--ed-text-muted); margin: .15rem 0 0; }

.box-controls { margin: 0; }

.box-header-actions {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: var(--ed-r-md);
	background: var(--ed-primary-soft);
}

.box-header-actions i { color: var(--ed-primary) !important; font-size: 1rem !important; }

.box-body,
.card-body { padding: 1.25rem !important; color: var(--ed-text); }

.box-header + .box-body { padding-top: .35rem !important; }
.box-header.with-border + .box-body { padding-top: 1.25rem !important; }

.box-footer {
	background: var(--ed-surface-2) !important;
	border-top: 1px solid var(--ed-border) !important;
	padding: .9rem 1.25rem !important;
}

/* Carte de statistique */
.ed-stat {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.ed-stat-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	min-width: 46px;
	border-radius: var(--ed-r-lg);
	background: var(--ed-primary-soft);
	color: var(--ed-primary);
	font-size: 1.15rem;
}

.ed-stat-value { font-size: 1.6rem; font-weight: 700; letter-spacing: -.03em; line-height: 1.1; }
.ed-stat-label { font-size: .82rem; color: var(--ed-text-muted); }

/* ------------------------------------------------------------------
   8. Boutons
   ------------------------------------------------------------------ */
.btn {
	--bs-btn-border-radius: var(--ed-r-md);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .45rem;
	padding: .5rem .95rem;
	font-size: .875rem;
	font-weight: 600;
	line-height: 1.35;
	border-radius: var(--ed-r-md);
	border: 1px solid transparent;
	box-shadow: none;
	transition: background-color .15s var(--ed-ease), border-color .15s var(--ed-ease), color .15s var(--ed-ease), box-shadow .15s var(--ed-ease), transform .08s var(--ed-ease);
	text-decoration: none;
}

.btn:active { transform: translateY(1px); }
.btn:focus-visible { outline: 0; box-shadow: var(--ed-ring); }
.btn i { font-size: .9em; }

.btn-lg { padding: .7rem 1.25rem; font-size: .95rem; border-radius: var(--ed-r-lg); }
.btn-sm { padding: .35rem .7rem; font-size: .8rem; border-radius: var(--ed-r-sm); }
.btn-xs { padding: .28rem .6rem; font-size: .765rem; border-radius: var(--ed-r-sm); gap: .3rem; }

.btn-primary {
	background: var(--ed-primary);
	border-color: var(--ed-primary);
	color: var(--ed-primary-contrast);
	box-shadow: var(--ed-shadow-xs);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-primary:not(:disabled):not(.disabled):active {
	background: var(--ed-primary-hover) !important;
	border-color: var(--ed-primary-hover) !important;
	color: var(--ed-primary-contrast) !important;
}

.btn-secondary {
	background: var(--ed-surface);
	border-color: var(--ed-border-strong);
	color: var(--ed-text-soft);
}
.btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
	background: var(--ed-surface-3) !important;
	border-color: var(--ed-border-strong) !important;
	color: var(--ed-text) !important;
}

.btn-success { background: var(--ed-success); border-color: var(--ed-success); color: #fff; }
.btn-success:hover, .btn-success:focus, .btn-success:active { filter: brightness(.93); background: var(--ed-success) !important; border-color: var(--ed-success) !important; color: #fff !important; }

.btn-danger { background: var(--ed-danger); border-color: var(--ed-danger); color: #fff; }
.btn-danger:hover, .btn-danger:focus, .btn-danger:active { filter: brightness(.93); background: var(--ed-danger) !important; border-color: var(--ed-danger) !important; color: #fff !important; }

.btn-warning { background: var(--ed-warning); border-color: var(--ed-warning); color: #fff; }
.btn-warning:hover, .btn-warning:focus, .btn-warning:active { filter: brightness(.93); background: var(--ed-warning) !important; border-color: var(--ed-warning) !important; color: #fff !important; }

.btn-info { background: var(--ed-info); border-color: var(--ed-info); color: #fff; }
.btn-info:hover, .btn-info:focus, .btn-info:active { filter: brightness(.93); background: var(--ed-info) !important; border-color: var(--ed-info) !important; color: #fff !important; }

.btn-outline,
.btn-outline-primary {
	background: var(--ed-surface) !important;
	border-color: var(--ed-border-strong) !important;
	color: var(--ed-text-soft) !important;
	box-shadow: var(--ed-shadow-xs);
}
.btn-outline:hover,
.btn-outline-primary:hover {
	background: var(--ed-primary-soft) !important;
	border-color: var(--ed-primary) !important;
	color: var(--ed-primary) !important;
}

.btn-link { color: var(--ed-primary); background: transparent; border: 0; padding: .35rem .4rem; }
.btn-link:hover { color: var(--ed-primary-hover); text-decoration: underline; }

.btn.disabled, .btn:disabled { opacity: .55; box-shadow: none; cursor: not-allowed; }

/* Bouton icone circulaire */
.btn-circle {
	width: 36px;
	height: 36px;
	padding: 0;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* Groupe de boutons */
.btn-group > .btn:not(:first-child) { margin-left: -1px; }
.btn-group > .btn:first-child:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.btn-group > .btn:last-child:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }

/* Liens-actions dans les tableaux */
table.dataTable td a[data-toggle="modal"]:not(.ed-act),
td .icon-with-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: var(--ed-r-sm);
	color: var(--ed-text-muted);
	transition: background-color .14s var(--ed-ease), color .14s var(--ed-ease);
}

table.dataTable td a[data-toggle="modal"]:not(.ed-act):hover,
td .icon-with-badge:hover { background: var(--ed-primary-soft); color: var(--ed-primary); }

table.dataTable td a[data-toggle="modal"]:not(.ed-act) .fa-xl,
table.dataTable td a[data-toggle="modal"]:not(.ed-act) i { font-size: .95rem !important; }

.icon-badge {
	top: -3px;
	right: -3px;
	background: var(--ed-danger);
	color: #fff;
	border-radius: var(--ed-r-pill);
	min-width: 16px;
	height: 16px;
	padding: 0 4px;
	font-size: .65rem;
	font-weight: 700;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	border: 2px solid var(--ed-surface);
}

/* ------------------------------------------------------------------
   9. Badges, etiquettes, alertes
   ------------------------------------------------------------------ */
.badge {
	display: inline-flex;
	align-items: center;
	gap: .3rem;
	padding: .3rem .55rem;
	font-size: .74rem;
	font-weight: 650;
	line-height: 1;
	border-radius: var(--ed-r-pill);
	letter-spacing: .005em;
}

.badge.bg-primary { background: var(--ed-primary-soft) !important; color: var(--ed-primary) !important; }
.badge.bg-success { background: var(--ed-success-soft) !important; color: var(--ed-success) !important; }
.badge.bg-danger  { background: var(--ed-danger-soft) !important;  color: var(--ed-danger) !important; }
.badge.bg-warning { background: var(--ed-warning-soft) !important; color: var(--ed-warning) !important; }
.badge.bg-info    { background: var(--ed-info-soft) !important;    color: var(--ed-info) !important; }

.alert {
	border: 1px solid var(--ed-border);
	border-radius: var(--ed-r-lg);
	padding: .85rem 1.05rem;
	font-size: .885rem;
	box-shadow: var(--ed-shadow-sm);
}

.alert-success { background: var(--ed-success-soft); border-color: transparent; color: var(--ed-success); }
.alert-danger  { background: var(--ed-danger-soft);  border-color: transparent; color: var(--ed-danger); }
.alert-warning { background: var(--ed-warning-soft); border-color: transparent; color: var(--ed-warning); }
.alert-info    { background: var(--ed-info-soft);    border-color: transparent; color: var(--ed-info); }

/* Toasts applicatifs */
.ed-toast-stack {
	position: fixed;
	right: 1.25rem;
	bottom: 1.25rem;
	z-index: 20000;
	display: flex;
	flex-direction: column;
	gap: .6rem;
	max-width: min(400px, calc(100vw - 2.5rem));
	pointer-events: none;
}

.ed-toast {
	pointer-events: auto;
	display: flex;
	align-items: flex-start;
	gap: .7rem;
	padding: .8rem .9rem;
	border-radius: var(--ed-r-lg);
	background: var(--ed-surface);
	border: 1px solid var(--ed-border);
	box-shadow: var(--ed-shadow-lg);
	color: var(--ed-text);
	font-size: .875rem;
	font-weight: 500;
	animation: ed-toast-in .28s var(--ed-ease);
}

.ed-toast.ed-toast-out { animation: ed-toast-out .22s var(--ed-ease) forwards; }

.ed-toast .ed-toast-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	min-width: 26px;
	border-radius: var(--ed-r-sm);
	font-size: .8rem;
}

.ed-toast-success .ed-toast-icon { background: var(--ed-success-soft); color: var(--ed-success); }
.ed-toast-error .ed-toast-icon { background: var(--ed-danger-soft); color: var(--ed-danger); }

.ed-toast .ed-toast-body { flex: 1 1 auto; padding-top: .15rem; }

.ed-toast .ed-toast-close {
	background: transparent;
	border: 0;
	color: var(--ed-text-muted);
	font-size: .95rem;
	line-height: 1;
	padding: .2rem;
	cursor: pointer;
	border-radius: var(--ed-r-xs);
}

.ed-toast .ed-toast-close:hover { background: var(--ed-surface-3); color: var(--ed-text); }

@keyframes ed-toast-in {
	from { opacity: 0; transform: translateY(10px) scale(.98); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes ed-toast-out {
	to { opacity: 0; transform: translateY(6px) scale(.98); }
}

/* ------------------------------------------------------------------
   10. Formulaires
   ------------------------------------------------------------------ */
.form-group { margin-bottom: .85rem; }
.form-group[style*="height"] { height: auto !important; }

label, .form-label {
	font-size: .82rem;
	font-weight: 600;
	color: var(--ed-text-soft);
	margin-bottom: .35rem;
}

.form-control,
.form-select,
input[type="text"].form-control,
input[type="email"].form-control,
input[type="number"].form-control,
input[type="date"].form-control,
input[type="datetime-local"].form-control,
input[type="time"].form-control,
input[type="search"].form-control,
input[type="password"].form-control,
textarea.form-control,
select.form-control {
	min-height: 40px;
	padding: .5rem .75rem;
	font-size: .885rem;
	font-family: var(--ed-font);
	line-height: 1.4;
	color: var(--ed-text);
	background-color: var(--ed-surface);
	background-clip: padding-box;
	border: 1px solid var(--ed-border-strong);
	border-radius: var(--ed-r-md);
	box-shadow: none;
	transition: border-color .15s var(--ed-ease), box-shadow .15s var(--ed-ease), background-color .15s var(--ed-ease);
}

textarea.form-control { min-height: 90px; }

.form-control::placeholder { color: var(--ed-text-muted); opacity: 1; }

.form-control:focus,
.form-select:focus,
select.form-control:focus,
textarea.form-control:focus {
	border-color: var(--ed-primary);
	background-color: var(--ed-surface);
	box-shadow: var(--ed-ring);
	outline: 0;
	color: var(--ed-text);
}

.form-control:disabled,
.form-control[readonly],
select.form-control:disabled {
	background-color: var(--ed-surface-3);
	color: var(--ed-text-muted);
	border-color: var(--ed-border);
	cursor: not-allowed;
	opacity: 1;
}

.form-control.is-invalid, .form-control:invalid:not(:placeholder-shown) { border-color: var(--ed-danger); }

/* Champs avec icone */
.input-group { flex-wrap: nowrap; }

.input-group > .input-group-text {
	background: var(--ed-surface-3);
	border: 1px solid var(--ed-border-strong);
	border-right: 0;
	border-radius: var(--ed-r-md) 0 0 var(--ed-r-md);
	color: var(--ed-text-muted);
	padding: .5rem .7rem;
	font-size: .85rem;
	min-width: 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.input-group > .form-control:not(:first-child),
.input-group > .form-select:not(:first-child),
.input-group > select:not(:first-child) {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

/* Select2 remplace le <select> par un conteneur frère : son bord gauche doit
   rester droit pour se raccorder à l'icône .input-group-text. */
.input-group .select2-container:not(:first-child) .select2-selection,
.input-group .select2-container:not(:first-child) .select2-selection--single,
.input-group .select2-container:not(:first-child) .select2-selection--multiple {
	border-top-left-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
}

/* Le conteneur Select2 occupe la largeur restante du groupe */
.input-group > .select2-container {
	flex: 1 1 auto;
	width: auto !important;
	min-width: 0;
}

.input-group:focus-within > .input-group-text {
	border-color: var(--ed-primary);
	color: var(--ed-primary);
	background: var(--ed-primary-soft);
}

/* Cases a cocher et boutons radio */
.form-check-input {
	width: 1.05rem;
	height: 1.05rem;
	margin-top: .16rem;
	border: 1.5px solid var(--ed-border-strong);
	background-color: var(--ed-surface);
	border-radius: var(--ed-r-xs);
	transition: background-color .12s var(--ed-ease), border-color .12s var(--ed-ease), box-shadow .12s var(--ed-ease);
	cursor: pointer;
}

.form-check-input[type="radio"] { border-radius: 50%; }

.form-check-input:checked {
	background-color: var(--ed-primary);
	border-color: var(--ed-primary);
}

.form-check-input:focus { box-shadow: var(--ed-ring); border-color: var(--ed-primary); outline: 0; }

.form-check-label {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	font-size: .875rem;
	font-weight: 500;
	color: var(--ed-text-soft);
	cursor: pointer;
	margin-bottom: 0;
}

/* Fieldsets */
fieldset {
	border: 1px solid var(--ed-border);
	border-radius: var(--ed-r-lg);
	padding: 1rem 1.15rem 1.15rem;
	margin-bottom: 1.15rem;
	background: var(--ed-surface-2);
}

fieldset > legend {
	float: none;
	width: auto;
	padding: 0 .5rem;
	margin: 0 0 .3rem -.5rem;
	font-size: .82rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--ed-text-muted);
	border: 0;
}

/* Titre de section de formulaire.
   Restreint aux <p> : la classe est aussi posée sur des conteneurs, comme
   la carte cadastrale de case.php, qui afficheraient sinon un trait de
   séparation pleine largeur alors qu'ils ne sont pas des titres. */
p.card-description {
	font-size: .78rem !important;
	font-weight: 700 !important;
	text-transform: uppercase;
	letter-spacing: .07em;
	color: var(--ed-text-muted) !important;
	margin: .6rem 0 .75rem !important;
	padding-bottom: .5rem;
	border-bottom: 1px solid var(--ed-border);
	width: 100%;
}

/* Champ fichier — le bouton occupe toute la hauteur du champ. Sans hauteur
   explicite il se dimensionne sur son contenu et laisse une bande claire
   sous le gris, le liseré du champ étant plus haut que lui. */
input[type="file"].form-control {
	height: 40px;
	padding: 0 .75rem 0 0;
	line-height: 38px;
	overflow: hidden;
}

input[type="file"]::file-selector-button {
	height: 100%;
	margin: 0 .75rem 0 0;
	padding: 0 .9rem;
	border: 0;
	border-right: 1px solid var(--ed-border);
	border-radius: 0;
	background: var(--ed-surface-3);
	color: var(--ed-text-soft);
	font-family: inherit;
	font-weight: 600;
	font-size: .82rem;
	line-height: 1;
	cursor: pointer;
	transition: background-color .12s var(--ed-ease), color .12s var(--ed-ease);
}

input[type="file"]::file-selector-button:hover { background: var(--ed-primary-soft); color: var(--ed-primary); }

/* Variante WebKit ancienne, même traitement */
input[type="file"]::-webkit-file-upload-button {
	height: 100%;
	margin: 0 .75rem 0 0;
	padding: 0 .9rem;
	border: 0;
	border-right: 1px solid var(--ed-border);
	border-radius: 0;
	background: var(--ed-surface-3);
	color: var(--ed-text-soft);
	font-family: inherit;
	font-weight: 600;
	font-size: .82rem;
	cursor: pointer;
}

/* ------------------------------------------------------------------
   11. Tableaux et DataTables
   ------------------------------------------------------------------ */
.table {
	--bs-table-bg: transparent;
	font-size: .865rem;
	color: var(--ed-text);
	margin-bottom: 0;
	border-color: var(--ed-border);
}

/* Le tableau porte son propre cadre : sans lui, les côtés et le bas restent
   ouverts et le bloc ne se referme pas. */
table.dataTable,
.box-body > .table,
.dataTables_wrapper table.table {
	border: 1px solid var(--ed-border);
	border-radius: var(--ed-r-md);
	border-collapse: separate !important;
	border-spacing: 0;
	margin: 0 !important;
}

.table > thead > tr > th,
table.dataTable thead th,
table.dataTable thead td {
	background: var(--ed-surface-2) !important;
	color: var(--ed-text-muted) !important;
	font-size: .74rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .055em;
	text-align: left;
	white-space: nowrap;
	padding: .7rem .85rem !important;
	border-top: 1px solid var(--ed-border) !important;
	border-bottom: 1px solid var(--ed-border) !important;
	vertical-align: middle;
}

/* Le cadre vient du tableau : les cellules d'angle n'arrondissent que le coin. */
table.dataTable thead th:first-child,
.table > thead > tr > th:first-child { border-top-left-radius: var(--ed-r-md); border-left: 0 !important; }
table.dataTable thead th:last-child,
.table > thead > tr > th:last-child { border-top-right-radius: var(--ed-r-md); border-right: 0 !important; }
table.dataTable thead th,
.table > thead > tr > th { border-top: 0 !important; }

/* Dernière ligne : pas de trait sous elle, le cadre s'en charge. */
table.dataTable > tbody > tr:last-child > td,
.table > tbody > tr:last-child > td { border-bottom: 0 !important; }

table.dataTable > tbody > tr:last-child > td:first-child { border-bottom-left-radius: var(--ed-r-md); }
table.dataTable > tbody > tr:last-child > td:last-child { border-bottom-right-radius: var(--ed-r-md); }

.table > tbody > tr > td,
table.dataTable tbody td {
	padding: .68rem .85rem !important;
	border-bottom: 1px solid var(--ed-border) !important;
	border-top: 0 !important;
	vertical-align: middle;
	color: var(--ed-text);
}

table.dataTable tbody tr { background: transparent !important; transition: background-color .12s var(--ed-ease); }

.table-hover > tbody > tr:hover > td,
.table-hover > tbody > tr:hover,
table.dataTable.table-hover tbody tr:hover {
	background-color: var(--ed-surface-3) !important;
	--bs-table-accent-bg: transparent;
}

table.dataTable tbody tr[data-toggle="modal"],
table.dataTable tbody tr[href] { cursor: pointer; }

table.dataTable tbody tr.selected,
table.dataTable tbody tr.selected td { background-color: var(--ed-primary-soft) !important; }

table.dataTable tfoot th,
.table > tfoot > tr > th {
	background: var(--ed-surface-2) !important;
	color: var(--ed-text) !important;
	font-size: .8rem;
	font-weight: 700;
	padding: .65rem .85rem !important;
	border-top: 1px solid var(--ed-border) !important;
}

/* Tris — DataTables dessine deux indicateurs, un ::before avec une flèche
   haute et un ::after avec une flèche basse. On masque le premier pour ne
   garder qu'un seul repère : double flèche au repos, simple une fois trié. */
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
	cursor: pointer;
	position: relative;
	padding-right: 1.55rem !important;
	background-image: none !important;
}

table.dataTable thead .sorting::before,
table.dataTable thead .sorting_asc::before,
table.dataTable thead .sorting_desc::before,
table.dataTable thead .sorting_asc_disabled::before,
table.dataTable thead .sorting_desc_disabled::before { display: none !important; content: none !important; }

table.dataTable thead .sorting::after,
table.dataTable thead .sorting_asc::after,
table.dataTable thead .sorting_desc::after {
	position: absolute;
	right: .6rem;
	left: auto;
	top: 50%;
	bottom: auto !important;
	display: block;
	transform: translateY(-50%);
	font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome;
	font-weight: 900;
	font-size: .62rem;
	opacity: .45;
	content: "\f0dc";
}
table.dataTable thead .sorting_asc::after  { content: "\f0d8"; opacity: 1; color: var(--ed-primary); }
table.dataTable thead .sorting_desc::after { content: "\f0d7"; opacity: 1; color: var(--ed-primary); }
table.dataTable thead .sorting:hover::after { opacity: .8; }
table.dataTable thead th.sorting_asc, table.dataTable thead th.sorting_desc { color: var(--ed-text) !important; }

/* Enveloppe */
.dataTables_wrapper { padding: 0; }

.dataTables_wrapper .dataTables_info {
	padding-top: 1rem !important;
	font-size: .8rem;
	color: var(--ed-text-muted);
}

.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter { font-size: .82rem; color: var(--ed-text-soft); }

.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .form-control {
	min-height: 36px;
	padding: .35rem .65rem !important;
	border: 1px solid var(--ed-border-strong);
	border-radius: var(--ed-r-md);
	background: var(--ed-surface);
	color: var(--ed-text);
	font-size: .85rem;
}

.dataTables_wrapper .dataTables_paginate { padding-top: .85rem !important; }

.dataTables_wrapper .pagination { gap: .25rem; margin: 0; flex-wrap: wrap; }

.dataTables_wrapper .pagination .page-item .page-link,
.pagination .page-link {
	min-width: 34px;
	height: 34px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 .55rem;
	margin: 0;
	border: 1px solid var(--ed-border);
	border-radius: var(--ed-r-sm) !important;
	background: var(--ed-surface);
	color: var(--ed-text-soft);
	font-size: .82rem;
	font-weight: 600;
	box-shadow: none;
	transition: background-color .13s var(--ed-ease), color .13s var(--ed-ease), border-color .13s var(--ed-ease);
}

.dataTables_wrapper .pagination .page-item .page-link:hover,
.pagination .page-link:hover {
	background: var(--ed-surface-3);
	border-color: var(--ed-border-strong);
	color: var(--ed-primary);
}

.dataTables_wrapper .pagination .page-item.active .page-link,
.pagination .page-item.active .page-link {
	background: var(--ed-primary) !important;
	border-color: var(--ed-primary) !important;
	color: #fff !important;
	box-shadow: var(--ed-shadow-xs);
}

.dataTables_wrapper .pagination .page-item.disabled .page-link,
.pagination .page-item.disabled .page-link {
	background: transparent;
	border-color: var(--ed-border);
	color: var(--ed-text-muted);
	opacity: .5;
}

.dataTables_wrapper .dataTables_processing {
	background: var(--ed-surface) !important;
	border: 1px solid var(--ed-border);
	border-radius: var(--ed-r-md);
	box-shadow: var(--ed-shadow-lg);
	color: var(--ed-text);
	font-size: .85rem;
	font-weight: 600;
	padding: .7rem 1.1rem !important;
	width: auto !important;
	margin-left: -80px !important;
}

.dataTables_wrapper .dataTables_scrollBody { border: 0 !important; }
.dataTables_scrollHead table.dataTable { margin-bottom: 0 !important; }

/* Barre de filtres au dessus du tableau */
.box-header form[name$="_search"] { width: 100%; margin: 0; }
.box-header form[name$="_search"] .form-group { margin-bottom: .5rem; }

/* Ligne responsive DataTables */
table.dataTable > tbody > tr.child ul.dtr-details { width: 100%; }
table.dataTable > tbody > tr.child span.dtr-title { font-weight: 650; color: var(--ed-text-soft); }
/* Contrôle de dépliage des colonnes masquées : un chevron, pas une pastille.
   Il pointe à droite fermé, pivote vers le bas ouvert.
   Dépend du correctif de class.output.php qui reconnaît la cellule de contrôle
   par sa structure et non par le glyphe de son ::before. */
table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td:first-child::before,
table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > th:first-child::before {
	content: "\f105" !important;
	font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome !important;
	font-weight: 900 !important;
	font-size: .95rem !important;
	line-height: 18px !important;
	width: 18px !important;
	height: 18px !important;
	top: 50% !important;
	left: .45rem !important;
	color: var(--ed-text-muted) !important;
	background: none !important;
	background-color: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	text-align: center;
	text-indent: 0 !important;
	transform: translateY(-50%);
	transition: transform .18s var(--ed-ease), color .13s var(--ed-ease);
}

/* Ligne dépliée : même glyphe, pivoté vers le bas */
table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td:first-child::before,
table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th:first-child::before {
	color: var(--ed-primary) !important;
	background-color: transparent !important;
	transform: translateY(-50%) rotate(90deg);
}

table.dataTable.dtr-inline.collapsed > tbody > tr:hover > td:first-child::before { color: var(--ed-primary) !important; }

/* La cellule de contrôle garde sa gouttière : sans cela le chevron passe
   sous le texte, la règle de padding générale étant en !important. */
table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td:first-child,
table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > th:first-child { padding-left: 2.1rem !important; }

table.dataTable.dtr-inline.collapsed > thead > tr > th:first-child { padding-left: 2.1rem !important; }

/* ------------------------------------------------------------------
   12. Select2
   ------------------------------------------------------------------ */
.select2-container--bootstrap-5 .select2-selection {
	min-height: 40px !important;
	height: auto !important;
	padding: .28rem .55rem !important;
	border: 1px solid var(--ed-border-strong) !important;
	border-radius: var(--ed-r-md) !important;
	background-color: var(--ed-surface) !important;
	color: var(--ed-text) !important;
	box-shadow: none !important;
	font-size: .885rem;
	display: flex;
	align-items: center;
}

.select2-container--bootstrap-5.select2-container--focus .select2-selection,
.select2-container--bootstrap-5.select2-container--open .select2-selection {
	border-color: var(--ed-primary) !important;
	box-shadow: var(--ed-ring) !important;
}

/* Le thème bootstrap-5 de Select2 ajoute une marge basse au libellé, ce qui
   le décale vers le haut dans un conteneur centré : on la neutralise pour
   aligner le texte sur celui d'un champ texte de même hauteur. */
.select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
	margin: 0 !important;
	padding: 0 1.3rem 0 .2rem !important;
	color: var(--ed-text) !important;
	line-height: 1.5;
	align-self: center;
}

.select2-container--bootstrap-5 .select2-selection__placeholder { color: var(--ed-text-muted) !important; }

.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__rendered {
	padding: 0 !important;
	gap: .25rem;
	flex-wrap: nowrap !important;
	align-items: center;
}

.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__choice {
	background: var(--ed-primary-soft) !important;
	color: var(--ed-primary) !important;
	border: 0 !important;
	box-shadow: none !important;
	border-radius: var(--ed-r-sm) !important;
	padding: .12rem .45rem !important;
	margin: 0 !important;
	font-size: .8rem;
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	gap: .3rem;
}

.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__choice__remove {
	color: var(--ed-primary) !important;
	opacity: .7;
	background: transparent !important;
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
}
.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__choice__remove:hover { opacity: 1; }

.select2-container--bootstrap-5 .select2-dropdown {
	border: 1px solid var(--ed-border) !important;
	border-radius: var(--ed-r-lg) !important;
	box-shadow: var(--ed-shadow-lg) !important;
	background: var(--ed-surface) !important;
	overflow: hidden;
	padding: .3rem;
}

.select2-container--bootstrap-5 .select2-results__option {
	padding: .45rem .6rem !important;
	border-radius: var(--ed-r-sm);
	font-size: .875rem;
	color: var(--ed-text) !important;
	background: transparent !important;
}

.select2-container--bootstrap-5 .select2-results__option--highlighted,
.select2-container--bootstrap-5 .select2-results__option--highlighted[aria-selected] {
	background: var(--ed-surface-3) !important;
	color: var(--ed-primary) !important;
}

.select2-container--bootstrap-5 .select2-results__option[aria-selected="true"],
.select2-container--bootstrap-5 .select2-results__option--selected {
	background: var(--ed-primary-soft) !important;
	color: var(--ed-primary) !important;
	font-weight: 600;
}

.select2-container--bootstrap-5 .select2-search--dropdown .select2-search__field {
	border: 1px solid var(--ed-border-strong) !important;
	border-radius: var(--ed-r-md) !important;
	background: var(--ed-surface) !important;
	color: var(--ed-text) !important;
	padding: .4rem .6rem !important;
	width: 100% !important;
	font-size: .85rem;
}

.select2-container--bootstrap-5 .select2-selection--single .select2-selection__clear,
.select2-container--bootstrap-5 .select2-selection__clear { color: var(--ed-text-muted) !important; }

.select2-container--open { z-index: 20050; }

/* Fleche du multiple, heritee du theme */
.select2-selection--multiple::before { border-color: var(--ed-text-muted) !important; }

/* ------------------------------------------------------------------
   13. Modales
   ------------------------------------------------------------------ */
.modal-backdrop.show { opacity: .45; background: #0b1220; }

.modal-content {
	border: 1px solid var(--ed-border) !important;
	border-radius: var(--ed-r-xl) !important;
	background: var(--ed-surface) !important;
	box-shadow: var(--ed-shadow-xl) !important;
	color: var(--ed-text);
	overflow: hidden;
}

.modal-header {
	padding: 1.05rem 1.35rem !important;
	border-bottom: 1px solid var(--ed-border) !important;
	background: var(--ed-surface) !important;
	align-items: center;
}

.modal-header { justify-content: space-between; }

.modal-title {
	font-size: 1.02rem;
	font-weight: 650;
	letter-spacing: -.015em;
	color: var(--ed-text);
	display: flex;
	align-items: center;
	gap: .55rem;
	flex: 1 1 auto;
	min-width: 0;
}

.modal-header .btn-close {
	width: 32px;
	height: 32px;
	padding: 0;
	/* `margin: 0` supprimerait le `margin-left: auto` de Bootstrap et la croix
	   viendrait se coller au titre au lieu de rester à droite. */
	margin: 0 0 0 auto;
	flex: 0 0 auto;
	border-radius: var(--ed-r-sm);
	opacity: .6;
	background-color: transparent;
	transition: background-color .13s var(--ed-ease), opacity .13s var(--ed-ease);
}
.modal-header .btn-close:hover { opacity: 1; background-color: var(--ed-surface-3); }
body.dark-skin .modal-header .btn-close { filter: invert(1) grayscale(1) brightness(2); }

.modal-body { padding: 1.35rem !important; }
.modal-footer { padding: 1rem 1.35rem !important; border-top: 1px solid var(--ed-border) !important; gap: .5rem; }

.modal-full { width: 96%; max-width: none; }
.modal-dialog { margin: 1.25rem auto; }

/* ------------------------------------------------------------------
   14. Onglets, listes, divers
   ------------------------------------------------------------------ */
.nav-tabs {
	border-bottom: 1px solid var(--ed-border);
	gap: .2rem;
}

.nav-tabs .nav-link {
	border: 0;
	border-bottom: 2px solid transparent;
	border-radius: 0;
	padding: .6rem .9rem;
	font-size: .885rem;
	font-weight: 600;
	color: var(--ed-text-muted);
	background: transparent;
	transition: color .14s var(--ed-ease), border-color .14s var(--ed-ease);
}

.nav-tabs .nav-link:hover { color: var(--ed-text); border-bottom-color: var(--ed-border-strong); }

.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
	color: var(--ed-primary);
	background: transparent;
	border-bottom-color: var(--ed-primary);
}

.nav-pills .nav-link {
	border-radius: var(--ed-r-md);
	font-weight: 600;
	font-size: .875rem;
	color: var(--ed-text-soft);
	padding: .45rem .85rem;
}
.nav-pills .nav-link.active { background: var(--ed-primary); color: #fff; }

/* Infobulles — le thème force un fond blanc et ses règles de flèche visent
   l'attribut Popper 1 (x-placement), inopérant avec Bootstrap 5.3 : on pilote
   donc les variables Bootstrap ET on neutralise les règles du thème. */
.tooltip {
	--bs-tooltip-bg: var(--ed-tooltip-bg);
	--bs-tooltip-color: var(--ed-tooltip-color);
	--bs-tooltip-opacity: 1;
	--bs-tooltip-border-radius: var(--ed-r-sm);
	--bs-tooltip-font-size: .78rem;
	--bs-tooltip-padding-x: .6rem;
	--bs-tooltip-padding-y: .35rem;
	--bs-tooltip-max-width: 280px;
	opacity: 1;
	z-index: 20100;
}

.tooltip.show { opacity: 1; }

.tooltip .tooltip-inner,
.tooltip-inner {
	background: var(--ed-tooltip-bg) !important;
	background-color: var(--ed-tooltip-bg) !important;
	color: var(--ed-tooltip-color) !important;
	border-radius: var(--ed-r-sm) !important;
	font-size: .78rem;
	font-weight: 500;
	line-height: 1.4;
	max-width: 280px;
	padding: .35rem .6rem !important;
	text-align: center;
	box-shadow: var(--ed-shadow-md) !important;
}

/* Flèche : on couvre les sélecteurs Bootstrap 4, Popper 1 et Popper 2 */
.bs-tooltip-top .tooltip-arrow::before,
.bs-tooltip-auto[x-placement^="top"] .tooltip-arrow::before,
.bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::before,
.tooltip[data-popper-placement^="top"] .tooltip-arrow::before { border-top-color: var(--ed-tooltip-bg) !important; }

.bs-tooltip-bottom .tooltip-arrow::before,
.bs-tooltip-auto[x-placement^="bottom"] .tooltip-arrow::before,
.bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow::before,
.tooltip[data-popper-placement^="bottom"] .tooltip-arrow::before { border-bottom-color: var(--ed-tooltip-bg) !important; }

.bs-tooltip-end .tooltip-arrow::before,
.bs-tooltip-auto[x-placement^="right"] .tooltip-arrow::before,
.bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::before,
.tooltip[data-popper-placement^="right"] .tooltip-arrow::before { border-right-color: var(--ed-tooltip-bg) !important; }

.bs-tooltip-start .tooltip-arrow::before,
.bs-tooltip-auto[x-placement^="left"] .tooltip-arrow::before,
.bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow::before,
.tooltip[data-popper-placement^="left"] .tooltip-arrow::before { border-left-color: var(--ed-tooltip-bg) !important; }

/* Placements latéraux : Popper écrit `top: 0` en ligne sur la flèche au lieu
   de la centrer. On recentre avec translateY(-50%) plutôt qu'une marge
   négative : le résultat ne dépend alors d'aucune hypothèse sur sa hauteur.
   Popper ne pose que `top` sur cet élément, `transform` est donc libre. */
.bs-tooltip-end .tooltip-arrow,
.bs-tooltip-start .tooltip-arrow,
.bs-tooltip-auto[x-placement^="right"] .tooltip-arrow,
.bs-tooltip-auto[x-placement^="left"] .tooltip-arrow,
.bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow,
.bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow,
.tooltip[data-popper-placement^="right"] .tooltip-arrow,
.tooltip[data-popper-placement^="left"] .tooltip-arrow {
	top: 50% !important;
	bottom: auto !important;
	margin-top: 0 !important;
	transform: translateY(-50%) !important;
}

.progress { height: 8px; border-radius: var(--ed-r-pill); background: var(--ed-surface-3); overflow: hidden; }
.progress-bar { background: var(--ed-primary); border-radius: var(--ed-r-pill); }

.avatar { border-radius: 50%; object-fit: cover; }

.blink { animation: ed-blink 1.4s ease-in-out infinite; }
@keyframes ed-blink { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }

.hidden { display: none !important; }

/* Editeur TinyMCE */
.tox-tinymce {
	border: 1px solid var(--ed-border-strong) !important;
	border-radius: var(--ed-r-md) !important;
	overflow: hidden;
}
.tox .tox-toolbar,
.tox .tox-toolbar__primary { background: var(--ed-surface-2) !important; border-bottom: 1px solid var(--ed-border) !important; }
body.dark-skin .tox .tox-edit-area__iframe { background: var(--ed-surface) !important; }
body.dark-skin .tox .tox-toolbar__primary { background: var(--ed-surface-2) !important; }

/* ------------------------------------------------------------------
   15. Page de connexion
   ------------------------------------------------------------------ */
body.ed-auth-page {
	background: var(--ed-canvas) !important;
	background-image: none !important;
	min-height: 100vh;
	display: block;
}

.ed-auth {
	position: relative;
	min-height: 100vh;
	display: grid;
	grid-template-columns: 1fr;
	overflow: hidden;
}

@media (min-width: 992px) {
	.ed-auth { grid-template-columns: 1.05fr .95fr; }
}

/* Colonne formulaire */
.ed-auth-form {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2.5rem 1.5rem;
	background: var(--ed-surface);
}

.ed-auth-card { width: 100%; max-width: 400px; }

.ed-auth-logo { margin-bottom: 2.25rem; display: block; text-align: center; }
.ed-auth-logo img { max-width: 190px; height: auto; }

.ed-auth-title {
	font-size: 1.65rem;
	font-weight: 700;
	letter-spacing: -.03em;
	margin: 0 0 .4rem;
	color: var(--ed-text);
}

.ed-auth-subtitle {
	font-size: .92rem;
	color: var(--ed-text-muted);
	margin: 0 0 1.85rem;
}

.ed-auth-card .form-control,
.ed-auth-card .btn { min-height: 46px; }
.ed-auth-card .btn { font-size: .92rem; border-radius: var(--ed-r-md); }
.ed-auth-card .form-group { margin-bottom: 1rem; }

.ed-auth-card hr {
	position: relative;
	margin: 1.6rem 0;
	overflow: visible;
}

.ed-auth-card hr::after {
	content: attr(data-label);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: var(--ed-surface);
	padding: 0 .75rem;
	font-size: .74rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--ed-text-muted);
}

.ed-auth-card .btn-outline img { margin-right: .5rem; float: none !important; }
.ed-auth-card .btn-outline span { font-weight: 600; }

.ed-auth-footer {
	margin-top: 2rem;
	font-size: .78rem;
	color: var(--ed-text-muted);
}

/* Colonne visuelle */
.ed-auth-aside {
	display: none;
	position: relative;
	padding: 3.5rem;
	color: #fff;
	background:
		radial-gradient(900px 520px at 15% 10%, rgba(100, 128, 248, .55), transparent 60%),
		radial-gradient(800px 640px at 90% 85%, rgba(14, 165, 233, .45), transparent 55%),
		linear-gradient(140deg, #1a2b6d 0%, #1f36ac 45%, #2a45d4 100%);
	overflow: hidden;
	align-items: center;
}

@media (min-width: 992px) { .ed-auth-aside { display: flex; } }

.ed-auth-aside::before,
.ed-auth-aside::after {
	content: "";
	position: absolute;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, .12);
}

.ed-auth-aside::before { width: 520px; height: 520px; right: -140px; top: -120px; }
.ed-auth-aside::after  { width: 360px; height: 360px; left: -110px; bottom: -90px; }

.ed-auth-aside-inner { position: relative; z-index: 1; max-width: 460px; }

.ed-auth-aside h2 {
	color: #fff;
	font-size: 2.05rem;
	font-weight: 700;
	letter-spacing: -.035em;
	line-height: 1.22;
	margin: 0 0 1rem;
}

.ed-auth-aside p {
	color: rgba(255, 255, 255, .78);
	font-size: 1rem;
	line-height: 1.6;
	margin: 0 0 2rem;
}

.ed-auth-points { list-style: none; margin: 0; padding: 0; display: grid; gap: .8rem; }

.ed-auth-points li {
	display: flex;
	align-items: center;
	gap: .7rem;
	font-size: .93rem;
	color: rgba(255, 255, 255, .9);
}

.ed-auth-points i {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	min-width: 28px;
	border-radius: var(--ed-r-sm);
	background: rgba(255, 255, 255, .14);
	font-size: .78rem;
}

/* ------------------------------------------------------------------
   16. Ajustements mode sombre
   ------------------------------------------------------------------ */
body.dark-skin .form-control,
body.dark-skin .form-select,
body.dark-skin select.form-control,
body.dark-skin textarea.form-control,
body.dark-skin input.form-control {
	background-color: var(--ed-surface-2) !important;
	border-color: var(--ed-border-strong) !important;
	color: var(--ed-text) !important;
}

body.dark-skin .form-control:focus,
body.dark-skin .form-select:focus {
	border-color: var(--ed-primary) !important;
	box-shadow: var(--ed-ring) !important;
}

body.dark-skin .form-control::placeholder { color: var(--ed-text-muted) !important; }

body.dark-skin .input-group > .input-group-text {
	background: var(--ed-surface-3) !important;
	border-color: var(--ed-border-strong) !important;
	color: var(--ed-text-muted) !important;
}

body.dark-skin .table,
body.dark-skin .table > tbody > tr > td,
body.dark-skin table.dataTable tbody td { color: var(--ed-text) !important; border-color: var(--ed-border) !important; }

body.dark-skin .dataTable input,
body.dark-skin .dataTable select {
	background-color: var(--ed-surface-2) !important;
	border-color: var(--ed-border-strong) !important;
	color: var(--ed-text) !important;
}

body.dark-skin .pagination > li > a,
body.dark-skin .page-item .page-link { background: var(--ed-surface-2) !important; border-color: var(--ed-border) !important; color: var(--ed-text-soft) !important; }
body.dark-skin .page-item.active .page-link { background: var(--ed-primary) !important; border-color: var(--ed-primary) !important; color: #fff !important; }

body.dark-skin .select2-container--bootstrap-5 .select2-selection,
body.dark-skin .select2-container .select2-selection--single,
body.dark-skin .select2-container .select2-selection--multiple {
	background-color: var(--ed-surface-2) !important;
	border-color: var(--ed-border-strong) !important;
	color: var(--ed-text) !important;
}

body.dark-skin .select2-container .select2-selection__rendered,
body.dark-skin .select2-container--bootstrap-5 .select2-selection__rendered { color: var(--ed-text) !important; }

body.dark-skin .select2-dropdown,
body.dark-skin .select2-container--bootstrap-5 .select2-dropdown {
	background-color: var(--ed-surface) !important;
	border-color: var(--ed-border) !important;
}

body.dark-skin .select2-results__option { background-color: transparent !important; color: var(--ed-text) !important; }

body.dark-skin .modal-content,
body.dark-skin .modal-header,
body.dark-skin .modal-footer,
body.dark-skin .dropdown-menu { background: var(--ed-surface) !important; border-color: var(--ed-border) !important; color: var(--ed-text) !important; }

body.dark-skin .box,
body.dark-skin .card { background: var(--ed-surface) !important; border-color: var(--ed-border) !important; }

body.dark-skin .box-header,
body.dark-skin .box-title,
body.dark-skin h1, body.dark-skin h2, body.dark-skin h3,
body.dark-skin h4, body.dark-skin h5, body.dark-skin h6 { color: var(--ed-text) !important; }

body.dark-skin .content-header .breadcrumb { background: var(--ed-surface) !important; border-color: var(--ed-border) !important; }

body.dark-skin .main-header .logo .logo-lg .dark-logo { display: block; }
body.dark-skin .main-header .logo .logo-lg .light-logo { display: none; }

body.dark-skin .btn-secondary,
body.dark-skin .btn-outline,
body.dark-skin .btn.btn-outline {
	background: var(--ed-surface-2) !important;
	border-color: var(--ed-border-strong) !important;
	color: var(--ed-text-soft) !important;
}
body.dark-skin .btn-outline:hover,
body.dark-skin .btn.btn-outline:hover { background: var(--ed-primary-soft) !important; color: var(--ed-primary) !important; border-color: var(--ed-primary) !important; }

body.dark-skin .ed-auth-form,
body.dark-skin .ed-auth-card hr::after { background: var(--ed-surface); }



/* ------------------------------------------------------------------
   17. Divers et compatibilite
   ------------------------------------------------------------------ */
.bg-white { background-color: var(--ed-surface) !important; }
.rounded10 { border-radius: var(--ed-r-xl) !important; }
.shadow-lg { box-shadow: var(--ed-shadow-lg) !important; }

/* Panneau lateral de demonstration du theme : neutralise */
.control-sidebar, .control-sidebar-bg { display: none !important; }

/* Espacement des lignes de formulaire generees */
form > .row, .row > form { row-gap: .2rem; }

/* Boutons empiles dans les en-tetes de page */
.content-header h4 .btn + .btn { margin-left: .25rem; }

/* Impression */
@media print {
	.main-header, .main-sidebar, .content-header .breadcrumb, .ed-toast-stack { display: none !important; }
	.content-wrapper { margin: 0 !important; padding: 0 !important; }
	.box { box-shadow: none !important; border-color: #ddd !important; break-inside: avoid; }
}

/* Preferences de mouvement reduit */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}

/* ------------------------------------------------------------------
   18. Boite de confirmation
   ------------------------------------------------------------------ */
.modal-dialog-sm { max-width: 420px; }

.ed-confirm { text-align: center; padding: .5rem .25rem .25rem; }

.ed-confirm-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: var(--ed-danger-soft);
	color: var(--ed-danger);
	font-size: 1.35rem;
	margin-bottom: 1rem;
}

.ed-confirm-text {
	font-size: .95rem;
	color: var(--ed-text-soft);
	margin: 0 0 1.4rem;
	line-height: 1.55;
}

.ed-confirm-actions {
	display: flex;
	gap: .6rem;
	justify-content: center;
	flex-wrap: wrap;
}

.ed-confirm-actions .btn { min-width: 120px; }

/* Colonne visuelle de la page de connexion */
.ed-auth-aside-inner { text-align: center; margin: 0 auto; }

.ed-auth-mark {
	width: 96px;
	height: 96px;
	border-radius: 24px;
	background: rgba(255, 255, 255, .12);
	padding: 14px;
	margin-bottom: 1.6rem;
	box-shadow: 0 18px 40px -14px rgba(0, 0, 0, .55);
}

.ed-auth-wordmark {
	font-size: 2.4rem;
	font-weight: 700;
	letter-spacing: -.04em;
	color: #fff;
	margin: 0;
	line-height: 1.1;
}

.ed-auth-tagline {
	font-size: .82rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .42em;
	color: rgba(255, 255, 255, .62);
	margin: .55rem 0 0;
	padding-left: .42em;
}

/* Champ mot de passe avec bascule de visibilite */
.ed-password { position: relative; }

/* Dans un groupe avec icône, il occupe la largeur restante et son bord
   gauche reste droit pour se raccorder à l'icône. */
.input-group > .ed-password { flex: 1 1 auto; min-width: 0; }
.input-group > .ed-password > .form-control {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
.ed-password .form-control { padding-right: 2.6rem; width: 100%; }

.ed-password-toggle {
	position: absolute;
	right: .35rem;
	top: 50%;
	transform: translateY(-50%);
	width: 30px;
	height: 30px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0;
	background: transparent;
	color: var(--ed-text-muted);
	border-radius: var(--ed-r-sm);
	cursor: pointer;
	transition: color .13s var(--ed-ease), background-color .13s var(--ed-ease);
}

.ed-password-toggle:hover { color: var(--ed-primary); background: var(--ed-surface-3); }

/* ------------------------------------------------------------------
   19. Correctifs de superposition et d'alignement du gabarit
   ------------------------------------------------------------------ */

/* La barre supérieure doit rester au-dessus de la navigation latérale */
.fixed .main-header,
body .main-header { z-index: 1030; }
.fixed .main-sidebar,
body .main-sidebar { z-index: 1020; }
.main-header div.logo-box { position: relative; z-index: 2; }

/* Le décalage vertical est géré par le padding du conteneur */
.fixed .content-wrapper,
.fixed .right-side { margin-top: 0 !important; }

/* Le logo occupe toute la boîte, sans centrage automatique */
.main-header .logo {
	width: 100%;
	margin: 0 !important;
	padding: 0 !important;
	gap: .5rem;
	overflow: visible;
	line-height: normal;
}

.main-header .logo .logo-mini,
.main-header .logo .logo-lg {
	line-height: normal;
	padding: 0;
	display: inline-flex;
	align-items: center;
}

.main-header .logo .logo-lg { min-width: 0; }
.main-header .logo .logo-lg img { max-width: 100%; }

/* La zone de droite de la barre supérieure est une rangée flexible */
.main-header .navbar-custom-menu,
.main-header .app-menu {
	float: none !important;
	display: flex;
	align-items: center;
	height: 100%;
}

.main-header .navbar-custom-menu > ul.navbar-nav,
.main-header .app-menu > ul.nav {
	display: flex !important;
	flex-direction: row;
	align-items: center;
	gap: .15rem;
	margin: 0;
	padding: 0;
	height: auto;
	float: none;
}

.main-header .navbar-custom-menu > ul.navbar-nav > li,
.main-header .app-menu > ul.nav > li {
	float: none !important;
	height: auto !important;
	display: flex;
	align-items: center;
	position: relative;
}

.main-header .navbar-nav > li > a { position: static; }

.ed-user-chip { max-width: 260px; overflow: hidden; }
.ed-user-chip .ed-user-meta { min-width: 0; overflow: hidden; }
.ed-user-chip .ed-user-name,
.ed-user-chip .ed-user-role {
	max-width: 150px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Menu déroulant du compte, ancré sous la pastille */
.main-header .user-menu .dropdown-menu {
	position: absolute;
	top: calc(100% + .45rem);
	right: 0;
	left: auto;
	margin: 0;
}

/* La pastille utilisateur n'est pas un bouton icône : elle garde sa largeur */
.main-header .navbar-nav > li > a.ed-user-chip,
.main-header .navbar-custom-menu .navbar-nav > li > a.ed-user-chip {
	width: auto;
	min-width: 0;
	max-width: none;
	height: 40px;
	padding: 0 .35rem;
	margin: 0 0 0 .35rem;
	border-radius: var(--ed-r-pill);
	overflow: visible;
	justify-content: flex-start;
}

.main-header .navbar-nav > li > a.ed-user-chip:hover {
	background: var(--ed-surface) !important;
	border-color: var(--ed-border-strong);
	color: var(--ed-text) !important;
}

.ed-user-chip .ed-user-meta { flex: 0 0 auto; }
.ed-user-chip .ed-user-name,
.ed-user-chip .ed-user-role { max-width: 160px; }

/* ------------------------------------------------------------------
   20. Palette sémantique des boutons (prioritaire sur le thème)
   ------------------------------------------------------------------ */
.theme-primary .btn-primary { background-color: var(--ed-primary); border-color: var(--ed-primary); color: var(--ed-primary-contrast); }
.theme-primary .btn-primary:hover, .theme-primary .btn-primary:focus, .theme-primary .btn-primary:active, .theme-primary .btn-primary.active {
	background-color: var(--ed-primary-hover) !important; border-color: var(--ed-primary-hover) !important; color: var(--ed-primary-contrast) !important;
}

.theme-primary .btn-success { background-color: var(--ed-success); border-color: var(--ed-success); color: #fff; }
.theme-primary .btn-success:hover, .theme-primary .btn-success:focus, .theme-primary .btn-success:active {
	background-color: #0d8a6b !important; border-color: #0d8a6b !important; color: #fff !important;
}

.theme-primary .btn-danger { background-color: var(--ed-danger); border-color: var(--ed-danger); color: #fff; }
.theme-primary .btn-danger:hover, .theme-primary .btn-danger:focus, .theme-primary .btn-danger:active {
	background-color: #be123c !important; border-color: #be123c !important; color: #fff !important;
}

.theme-primary .btn-warning { background-color: var(--ed-warning); border-color: var(--ed-warning); color: #fff; }
.theme-primary .btn-warning:hover, .theme-primary .btn-warning:focus, .theme-primary .btn-warning:active {
	background-color: #b45309 !important; border-color: #b45309 !important; color: #fff !important;
}

.theme-primary .btn-info { background-color: var(--ed-info); border-color: var(--ed-info); color: #fff; }
.theme-primary .btn-info:hover, .theme-primary .btn-info:focus, .theme-primary .btn-info:active {
	background-color: #0284c7 !important; border-color: #0284c7 !important; color: #fff !important;
}

.theme-primary .btn-link { color: var(--ed-primary); }

.theme-primary .btn-outline,
.theme-primary .btn-outline.btn-primary {
	background-color: var(--ed-surface) !important;
	border-color: var(--ed-border-strong) !important;
	color: var(--ed-text-soft) !important;
}
.theme-primary .btn-outline:hover,
.theme-primary .btn-outline.btn-primary:hover,
.theme-primary .btn-outline.btn-primary:active {
	background-color: var(--ed-primary-soft) !important;
	border-color: var(--ed-primary) !important;
	color: var(--ed-primary) !important;
}

/* La navigation ne déborde pas horizontalement — mais on ne le règle PAS
   avec `overflow-x: hidden` sur la barre : en CSS, dès qu'un axe passe à
   `hidden`, l'autre bascule en `auto`, ce qui faisait apparaître un
   ascenseur vertical. On contraint donc la largeur des conteneurs internes,
   hérités du thème à 22.8rem, et le défilement reste sur la zone prévue. */
.main-sidebar { overflow: visible; }

.main-sidebar .sidebar,
.main-sidebar .multinav { width: 100%; max-width: 100%; }

.main-sidebar .multinav-scroll {
	width: 100%;
	max-width: 100%;
	overflow-x: hidden;
	overflow-y: auto;
}

.sidebar-widgets { max-width: 100%; }

@media (min-width: 768px) {
	/* Replié, la barre n'a pas besoin de défiler : les menus volants doivent
	   au contraire pouvoir sortir de son cadre au survol. */
	.sidebar-mini.sidebar-collapse .main-sidebar .multinav,
	.sidebar-mini.sidebar-collapse .main-sidebar .multinav-scroll { overflow: visible; }
}

/* ------------------------------------------------------------------
   21. Barre supérieure sur petit écran : une seule rangée
   ------------------------------------------------------------------ */
@media (max-width: 767px) {
	.main-header {
		display: flex;
		align-items: center;
		height: var(--ed-topbar-h);
		max-height: var(--ed-topbar-h);
		background: var(--ed-topbar);
		-webkit-backdrop-filter: saturate(180%) blur(14px);
		backdrop-filter: saturate(180%) blur(14px);
		border-bottom: 1px solid var(--ed-border);
	}
	.main-header > div.logo-box {
		width: auto !important;
		float: none !important;
		flex: 0 0 auto;
		height: var(--ed-topbar-h);
		border-bottom: 0 !important;
		background: transparent !important;
	}
	.main-header > nav.navbar {
		width: auto !important;
		float: none !important;
		flex: 1 1 auto;
		margin: 0 !important;
		padding: 0 .75rem 0 .25rem;
		border-bottom: 0 !important;
		background: transparent !important;
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}
	.main-header .logo .logo-lg { display: none; }
	.main-header .logo .logo-mini { display: inline-flex; }
	.content-wrapper { overflow-x: hidden; }
	.container-full { max-width: 100%; }
	.dataTables_wrapper { overflow-x: auto; }
	.ed-user-chip .ed-user-meta, .ed-user-chip .ed-chevron { display: none; }
}

/* Les formulaires de filtre occupent toute la largeur de l'en-tête de carte */
.box-header > form { width: 100%; margin: 0; }
.box-header > form > .form-group:last-child { margin-bottom: 0; }

/* ==================================================================
   22. Actions de ligne — tuiles à emplacement fixe
   Une teinte par action, toutes de même intensité : la couleur dit
   laquelle, jamais laquelle compte le plus. Chaque action occupe
   toujours la même colonne, occupée ou non, pour que le bloc garde
   la même largeur d'une ligne à l'autre.
   ================================================================== */
.ed-actions {
	display: inline-grid;
	grid-template-columns: repeat(var(--ed-act-cols, 7), 32px);
	gap: 5px;
	justify-items: center;
	align-items: center;
	line-height: 1;
}

.ed-act {
	position: relative;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	margin: 0;
	border: 1px solid transparent;
	border-radius: var(--ed-r-sm);
	background: var(--ed-act-soft);
	color: var(--ed-act-ink);
	cursor: pointer;
	text-decoration: none;
	transition: background-color .13s var(--ed-ease), color .13s var(--ed-ease), transform .08s var(--ed-ease);
}

/* Le thème pose `.theme-primary a:hover { color: #2a45d4 }`, soit (0,2,1) :
   il faut donc inclure l'élément `a` ici, sinon sa teinte l'emporte et
   l'icône reste bleue sur un fond bleu. */
a.ed-act:hover,
a.ed-act:focus,
a.ed-act:active {
	background: var(--ed-act-ink);
	/* En thème sombre les teintes sont claires : une icône blanche y serait
	   illisible. --ed-text-invert vaut blanc en clair, encre foncée en sombre. */
	color: var(--ed-text-invert);
	text-decoration: none;
}

a.ed-act:hover > i,
a.ed-act:focus > i,
a.ed-act:active > i { color: var(--ed-text-invert); }

.ed-act:active { transform: translateY(1px); }
.ed-act:focus-visible { outline: 2px solid var(--ed-act-ink); outline-offset: 2px; }

.ed-act > i {
	font-size: .95rem !important;
	line-height: 1;
	color: inherit;
}

/* Compteur : lisible sur fond teinté, sans crier */
.ed-act-badge {
	position: absolute;
	top: -6px;
	right: -6px;
	min-width: 17px;
	height: 17px;
	padding: 0 4px;
	border-radius: var(--ed-r-pill);
	background: var(--ed-surface);
	border: 1px solid var(--ed-border-strong);
	color: var(--ed-text-soft);
	font-size: .63rem;
	font-weight: 700;
	line-height: 15px;
	text-align: center;
	font-variant-numeric: tabular-nums;
	pointer-events: none;
}

.ed-act:hover .ed-act-badge { border-color: transparent; }

/* Une teinte par type d'action. Les alias partagent une teinte parce qu'ils
   partagent une nature — ils n'apparaissent jamais ensemble sur une page. */
.ed-act--miss  { --ed-act-soft: var(--ed-danger-soft);  --ed-act-ink: var(--ed-danger); }
.ed-act--tel   { --ed-act-soft: var(--ed-warning-soft); --ed-act-ink: var(--ed-warning); }

.ed-act--doc,
.ed-act--money,
.ed-act--open  { --ed-act-soft: var(--ed-primary-soft); --ed-act-ink: var(--ed-primary); }

.ed-act--dep,
.ed-act--dl    { --ed-act-soft: var(--ed-cyan-soft);    --ed-act-ink: var(--ed-cyan); }

.ed-act--send,
.ed-act--login { --ed-act-soft: var(--ed-success-soft); --ed-act-ink: var(--ed-success); }

.ed-act--hist,
.ed-act--copy,
.ed-act--lang  { --ed-act-soft: var(--ed-violet-soft);  --ed-act-ink: var(--ed-violet); }

.ed-act--del   { --ed-act-soft: var(--ed-slate-soft);   --ed-act-ink: var(--ed-slate); }

/* État figé, non cliquable : traitement en cours */
.ed-act--wait,
span.ed-act--wait:hover {
	--ed-act-soft: var(--ed-surface-3);
	--ed-act-ink: var(--ed-text-muted);
	background: var(--ed-surface-3);
	color: var(--ed-text-muted);
	cursor: default;
}

/* La suppression reste grise au repos et devient rouge à la visée :
   ce n'est pas une hiérarchie, c'est un garde-fou avant un clic définitif. */
a.ed-act--del:hover,
a.ed-act--del:focus,
a.ed-act--del:active { background: var(--ed-danger); color: var(--ed-text-invert); }

a.ed-act--del:hover > i,
a.ed-act--del:focus > i,
a.ed-act--del:active > i { color: var(--ed-text-invert); }

.ed-act--del:focus-visible { outline-color: var(--ed-danger); }

/* Action indisponible sur ce dossier : le bouton garde sa place et sa forme,
   éteint, plutôt que de laisser un trou dans la rangée. */
.ed-act--off,
.ed-act--off:hover,
.ed-act--off:focus {
	background: var(--ed-surface-3);
	border-color: transparent;
	color: var(--ed-text-muted);
	opacity: .5;
	cursor: not-allowed;
	transform: none;
}

.ed-act--off > i { color: var(--ed-text-muted); }

/* En-tête de la colonne, aligné sur le bloc */
td.ed-actions-cell, th.ed-actions-cell { text-align: center; white-space: nowrap; }

@media (max-width: 767px) {
	.ed-actions { grid-template-columns: repeat(var(--ed-act-cols, 7), 30px); gap: 4px; }
	.ed-act { width: 30px; height: 30px; }
}

/* ==================================================================
   23. Couleur — cinq pistes validées
   Chaque bloc est indépendant : supprimer un bloc retire une piste
   sans toucher aux autres.
   ================================================================== */

/* ------------------------------------------------------------------
   23.1 · Navigation encrée
   La colonne de gauche et la boîte du logo passent en bleu nuit. En
   thème sombre elles reprennent simplement les surfaces existantes.
   ------------------------------------------------------------------ */
:root {
	--ed-nav-bg: #121a37;
	--ed-nav-ink: #97a3c4;
	--ed-nav-ink-strong: #ffffff;
	--ed-nav-line: rgba(255, 255, 255, .09);
	--ed-nav-hover: rgba(255, 255, 255, .06);
	--ed-nav-active-bg: rgba(125, 149, 251, .18);
	--ed-nav-active-ink: #b9c6ff;
	--ed-nav-fade: rgba(255, 255, 255, .45);
}

body.dark-skin {
	--ed-nav-bg: #101725;
	--ed-nav-ink: #a9b4cc;
	--ed-nav-ink-strong: #e8ecf6;
	--ed-nav-line: #253150;
	--ed-nav-hover: rgba(255, 255, 255, .05);
	--ed-nav-active-bg: rgba(125, 149, 251, .16);
	--ed-nav-active-ink: #9fb3ff;
	--ed-nav-fade: rgba(233, 238, 250, .42);
}

.main-sidebar {
	background: var(--ed-nav-bg) !important;
	border-right: 1px solid var(--ed-nav-line);
}

.main-header div.logo-box {
	background: var(--ed-nav-bg) !important;
	border-right: 1px solid var(--ed-nav-line) !important;
	border-bottom: 1px solid var(--ed-nav-line) !important;
}

/* Sur fond encré, c'est la version claire du logo qu'il faut, dans les
   deux thèmes — le thème ne la sortait qu'en mode sombre. */
.main-header .logo .logo-lg .light-logo { display: none !important; }
.main-header .logo .logo-lg .dark-logo { display: block !important; }

.ed-profile-card {
	background: rgba(255, 255, 255, .07);
	border-color: var(--ed-nav-line);
}

.ed-profile-card .avatar,
.ed-profile-card img { border-color: rgba(255, 255, 255, .16) !important; }
.ed-profile-card .ed-profile-name { color: var(--ed-nav-ink-strong); }
.ed-profile-card .ed-profile-meta { color: var(--ed-nav-ink); }

.sidebar-menu > li.ed-nav-label,
.ed-nav-label { color: var(--ed-nav-fade); }

.sidebar-menu > li > a,
.sidebar-menu .treeview-menu > li > a { color: var(--ed-nav-ink) !important; }

.sidebar-menu > li > a:hover,
.sidebar-menu .treeview-menu > li > a:hover {
	background: var(--ed-nav-hover) !important;
	color: var(--ed-nav-ink-strong) !important;
}

.sidebar-menu > li.active > a,
.sidebar-menu > li > a.active,
.sidebar-menu .treeview-menu > li.active > a,
.sidebar-menu .treeview-menu > li > a.active {
	background: var(--ed-nav-active-bg) !important;
	color: var(--ed-nav-active-ink) !important;
}

.sidebar-menu > li.active > a::before,
.sidebar-menu > li > a.active::before { background: var(--ed-nav-active-ink); }

.treeview-menu::before { background: var(--ed-nav-line); }

.sidebar-menu > li.treeview > a > .fa-angle-left,
.sidebar-menu > li.treeview > a > .pull-right { color: var(--ed-nav-fade) !important; }

.sidebar-widgets .copyright {
	border-top-color: var(--ed-nav-line);
	color: var(--ed-nav-fade);
}

.main-sidebar * { scrollbar-color: rgba(255, 255, 255, .22) transparent; }
.main-sidebar ::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .22); background-clip: content-box; }

@media (min-width: 768px) {
	.sidebar-mini.sidebar-collapse .sidebar-menu > li.ed-nav-label { background: var(--ed-nav-line); }
	.sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right),
	.sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
		background: var(--ed-nav-bg) !important;
		border-color: var(--ed-nav-line);
		color: var(--ed-nav-ink-strong);
	}
}

/* ------------------------------------------------------------------
   23.2 · Icônes de navigation colorées
   Même vocabulaire que les tuiles d'action : la teinte identifie la
   rubrique, elle ne la hiérarchise pas.
   ------------------------------------------------------------------ */
.sidebar-menu > li > a > i.menu-icon,
.sidebar-menu .treeview-menu > li > a > i.menu-icon {
	width: 26px !important;
	min-width: 26px;
	height: 26px;
	border-radius: var(--ed-r-sm) !important;
	background: var(--ed-navi-soft, transparent) !important;
	color: var(--ed-navi-ink, var(--ed-nav-ink)) !important;
	font-size: .85rem !important;
}

.sidebar-menu > li > a:hover > i.menu-icon,
.sidebar-menu > li.active > a > i.menu-icon,
.sidebar-menu > li > a.active > i.menu-icon { color: var(--ed-navi-ink, var(--ed-nav-ink-strong)) !important; }

/* Douze teintes, une par rubrique, aucune répétition. Le rouge reste
   réservé aux alertes et le gris se lirait comme une pastille absente :
   la palette tourne donc autour du bleu, du vert et de l'ambre, avec des
   voisines placées loin les unes des autres dans le menu. */
.ed-navi--blue      { --ed-navi-soft: rgba(143, 166, 255, .20); --ed-navi-ink: #8fa6ff; }
.ed-navi--indigo    { --ed-navi-soft: rgba(169, 155, 251, .20); --ed-navi-ink: #a99bfb; }
.ed-navi--violet    { --ed-navi-soft: rgba(201, 168, 251, .20); --ed-navi-ink: #c9a8fb; }
.ed-navi--lavender  { --ed-navi-soft: rgba(221, 204, 249, .18); --ed-navi-ink: #ddccf9; }
.ed-navi--cyan      { --ed-navi-soft: rgba(111, 208, 242, .20); --ed-navi-ink: #6fd0f2; }
.ed-navi--turquoise { --ed-navi-soft: rgba(79, 216, 221, .20);  --ed-navi-ink: #4fd8dd; }
.ed-navi--teal      { --ed-navi-soft: rgba(69, 212, 176, .20);  --ed-navi-ink: #45d4b0; }
.ed-navi--green     { --ed-navi-soft: rgba(124, 224, 161, .20); --ed-navi-ink: #7ce0a1; }
.ed-navi--lime      { --ed-navi-soft: rgba(189, 224, 120, .20); --ed-navi-ink: #bde078; }
.ed-navi--olive     { --ed-navi-soft: rgba(210, 207, 120, .20); --ed-navi-ink: #d2cf78; }
.ed-navi--amber     { --ed-navi-soft: rgba(243, 196, 107, .20); --ed-navi-ink: #f3c46b; }
.ed-navi--orange    { --ed-navi-soft: rgba(247, 168, 110, .20); --ed-navi-ink: #f7a86e; }

/* ------------------------------------------------------------------
   23.3 · Indicateurs colorés
   La pastille d'en-tête de carte prend la teinte de sa mesure.
   ------------------------------------------------------------------ */
.box-header-actions {
	background: var(--ed-kpi-soft, var(--ed-primary-soft)) !important;
	color: var(--ed-kpi-ink, var(--ed-primary)) !important;
}

.box-header-actions i { color: var(--ed-kpi-ink, var(--ed-primary)) !important; }

.ed-kpi--brand  { --ed-kpi-soft: var(--ed-primary-soft); --ed-kpi-ink: var(--ed-primary); }
.ed-kpi--green  { --ed-kpi-soft: var(--ed-success-soft); --ed-kpi-ink: var(--ed-success); }
.ed-kpi--violet { --ed-kpi-soft: var(--ed-violet-soft);  --ed-kpi-ink: var(--ed-violet); }
.ed-kpi--cyan   { --ed-kpi-soft: var(--ed-cyan-soft);    --ed-kpi-ink: var(--ed-cyan); }
.ed-kpi--amber  { --ed-kpi-soft: var(--ed-warning-soft); --ed-kpi-ink: var(--ed-warning); }
.ed-kpi--slate  { --ed-kpi-soft: var(--ed-slate-soft);   --ed-kpi-ink: var(--ed-slate); }

/* ------------------------------------------------------------------
   23.4 · Lignes marquées par l'état
   Un liseré posé en ombre intérieure, pour ne pas entrer en conflit
   avec le ::before du contrôle de dépliage sur la même cellule.
   ------------------------------------------------------------------ */
table.dataTable tbody tr > td:first-child {
	box-shadow: inset 3px 0 0 0 var(--ed-row-ink, var(--ed-banner));
}

tr.ed-row--unassigned { --ed-row-ink: var(--ed-slate); }
tr.ed-row--processing { --ed-row-ink: var(--ed-warning); }
tr.ed-row--reviewed   { --ed-row-ink: var(--ed-cyan); }
tr.ed-row--validated  { --ed-row-ink: var(--ed-success); }
tr.ed-row--closed     { --ed-row-ink: var(--ed-violet); }
tr.ed-row--error      { --ed-row-ink: var(--ed-danger); }

/* Actif ou inactif, paye ou impaye : les seules colonnes qui portent un
   jugement. Partout ailleurs le liseré garde le bleu du bandeau. */
tr.ed-row--on { --ed-row-ink: var(--ed-success); }
tr.ed-row--ko { --ed-row-ink: var(--ed-danger); }


/* Seule l'erreur teinte toute la ligne : c'est la seule qui appelle
   une action de la part de l'utilisateur. */
table.dataTable tbody tr.ed-row--error > td { background: var(--ed-danger-soft); }
table.dataTable.table-hover tbody tr.ed-row--error:hover > td { background: var(--ed-danger-soft); filter: brightness(.98); }

/* ------------------------------------------------------------------
   23.5 · Fond teinté
   Le gris neutre devient un bleu très pâle dérivé de la marque.
   ------------------------------------------------------------------ */
:root {
	--ed-canvas: #eef1fa;
	/* Bleu du bandeau de titre, repris tel quel par l'en-tête des modales. */
	--ed-banner: #243b9e;
}

/* ------------------------------------------------------------------
   23.6 · Bandeau de titre
   Bloc autonome : le supprimer entièrement rend l'en-tête de page à
   son état neutre, sans effet sur le reste.
   ------------------------------------------------------------------ */
.content-header {
	background: var(--ed-banner);
	border-radius: var(--ed-r-lg);
	padding: .9rem 1.15rem !important;
	margin-bottom: 1.35rem;
	box-shadow: var(--ed-shadow-sm);
}

.content-header > h4,
.content-header > .ed-page-title { color: #fff; }

.content-header > h4 > i:first-child,
.content-header > .ed-page-title > i:first-child {
	background: rgba(255, 255, 255, .18);
	color: #fff;
}

.content-header > h4 > small { color: rgba(255, 255, 255, .7); }

.content-header .breadcrumb {
	background: rgba(255, 255, 255, .14) !important;
	border-color: rgba(255, 255, 255, .22);
	box-shadow: none;
}

.content-header .breadcrumb > li,
.content-header .breadcrumb > li > a { color: rgba(255, 255, 255, .82); }
.content-header .breadcrumb > li > a:hover { color: #fff; }
.content-header .breadcrumb > li.active { color: #fff; }
.content-header .breadcrumb > li + li::before { background: rgba(255, 255, 255, .45); }

/* Les boutons d'action passent en fond blanc : ils gardent leur
   couleur sémantique en texte, sans se noyer dans le bleu du bandeau. */
.content-header .btn { background: #fff !important; border-color: transparent !important; box-shadow: var(--ed-shadow-xs); }
.content-header .btn-success { color: var(--ed-success) !important; }
.content-header .btn-warning { color: var(--ed-warning) !important; }
.content-header .btn-info    { color: var(--ed-info) !important; }
.content-header .btn-danger  { color: var(--ed-danger) !important; }
.content-header .btn-primary { color: var(--ed-primary) !important; }
.content-header .btn:hover { filter: brightness(.96); }

@media (max-width: 767px) {
	.content-header { padding: .8rem .9rem !important; }

	/* Sans navigation visible à côté, la boîte du logo encrée formerait un
	   carré sombre isolé : elle reprend le fond de la barre supérieure. */
	.main-header div.logo-box {
		background: transparent !important;
		border-right: 0 !important;
		border-bottom: 0 !important;
	}
}

/* ------------------------------------------------------------------
   23.7 · Pastille de statut
   Même teinte que le liseré de la ligne : le statut et le bord parlent
   de la même donnée, ils ne peuvent pas se contredire.
   ------------------------------------------------------------------ */
.ed-state {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .2rem .6rem;
	border-radius: var(--ed-r-pill);
	background: var(--ed-state-soft);
	color: var(--ed-state-ink);
	font-size: .75rem;
	font-weight: 650;
	line-height: 1.4;
	white-space: nowrap;
}

.ed-state::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: currentColor;
	flex: 0 0 auto;
}

.ed-state--unassigned { --ed-state-soft: var(--ed-slate-soft);   --ed-state-ink: var(--ed-slate); }
.ed-state--processing { --ed-state-soft: var(--ed-warning-soft); --ed-state-ink: var(--ed-warning); }
.ed-state--reviewed   { --ed-state-soft: var(--ed-cyan-soft);    --ed-state-ink: var(--ed-cyan); }
.ed-state--validated  { --ed-state-soft: var(--ed-success-soft); --ed-state-ink: var(--ed-success); }
.ed-state--closed     { --ed-state-soft: var(--ed-violet-soft);  --ed-state-ink: var(--ed-violet); }
.ed-state--error      { --ed-state-soft: var(--ed-danger-soft);  --ed-state-ink: var(--ed-danger); }

/* ------------------------------------------------------------------
   24 · Widgets du tableau de bord
   ------------------------------------------------------------------ */
.ed-kpi-row { margin-bottom: .25rem; }

.ed-kpi-tile .box-body { padding: 1.1rem 1.15rem !important; }
.ed-kpi-tile { position: relative; overflow: hidden; }

/* Filet de couleur en haut de la tuile : rappelle la teinte de la mesure
   sans colorer toute la carte. */
.ed-kpi-tile::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 3px;
	background: var(--ed-kpi-ink, var(--ed-primary));
}

.ed-kpi-head { display: flex; align-items: center; gap: .55rem; margin-bottom: .7rem; }

.ed-kpi-ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: var(--ed-r-sm);
	background: var(--ed-kpi-soft, var(--ed-primary-soft));
	color: var(--ed-kpi-ink, var(--ed-primary));
	font-size: .82rem;
	flex: 0 0 auto;
}

.ed-kpi-label {
	font-size: .76rem;
	font-weight: 650;
	color: var(--ed-text-muted);
	text-transform: uppercase;
	letter-spacing: .04em;
	line-height: 1.25;
	min-width: 0;
}

.ed-kpi-value {
	font-size: 1.85rem;
	font-weight: 750;
	letter-spacing: -.035em;
	line-height: 1.1;
	color: var(--ed-text);
	font-variant-numeric: tabular-nums;
}

.ed-kpi-foot {
	margin-top: .35rem;
	font-size: .78rem;
	color: var(--ed-text-muted);
	display: flex;
	align-items: center;
	gap: .35rem;
	flex-wrap: wrap;
}

.ed-trend {
	display: inline-flex;
	align-items: center;
	gap: .25rem;
	padding: .1rem .4rem;
	border-radius: var(--ed-r-pill);
	font-size: .74rem;
	font-weight: 700;
}

.ed-trend.is-up { background: var(--ed-success-soft); color: var(--ed-success); }
.ed-trend.is-down { background: var(--ed-danger-soft); color: var(--ed-danger); }

/* Histogramme compact */
.ed-spark { width: 100%; height: 26px; margin-top: .6rem; display: block; }
.ed-spark rect { fill: var(--ed-kpi-ink, var(--ed-primary)); opacity: .28; }
.ed-spark rect.ed-spark-last { opacity: 1; }

/* Fil d'activité */
.ed-feed { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }

.ed-feed-item {
	display: flex;
	align-items: center;
	gap: .7rem;
	padding: .55rem 0;
	border-bottom: 1px solid var(--ed-border);
}

.ed-feed-item:last-child { border-bottom: 0; padding-bottom: 0; }
.ed-feed-item:first-child { padding-top: 0; }

.ed-feed-ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	min-width: 30px;
	border-radius: var(--ed-r-sm);
	background: var(--ed-kpi-soft, var(--ed-surface-3));
	color: var(--ed-kpi-ink, var(--ed-text-muted));
	font-size: .78rem;
}

.ed-feed-body { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }

.ed-feed-title {
	font-size: .855rem;
	font-weight: 600;
	color: var(--ed-text);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.ed-feed-date { font-size: .74rem; color: var(--ed-text-muted); font-variant-numeric: tabular-nums; }

/* ------------------------------------------------------------------
   25 · Sections de formulaire
   Le filet court sur toute la section, titre et champs compris. Les
   sections sont fabriquées au rendu par ed_sectionner() ; les pages qui
   n'y sont pas encore passées gardent un filet sur le seul titre, ce qui
   reste cohérent visuellement.
   ------------------------------------------------------------------ */
.ed-sec {
	border-left: 3px solid var(--ed-sec-ink, var(--ed-primary));
	padding-left: .85rem;
	margin-bottom: 1.35rem;
}

/* Pas de `:last-child` ici : selon les pages, une rangée contient plusieurs
   sections (case.php) ou une seule (profil, sondages…). Avec l'exception,
   toute section seule dans sa rangée perdait sa marge et se collait à la
   suivante. L'espacement est donc porté par toutes, sans exception. */

.ed-sec > .card-description {
	color: var(--ed-sec-ink, var(--ed-primary)) !important;
	border-bottom: 0;
	padding-bottom: 0;
	margin-bottom: .6rem !important;
}

.ed-sec--blue     { --ed-sec-ink: var(--ed-primary); }
.ed-sec--cyan     { --ed-sec-ink: var(--ed-cyan); }
.ed-sec--violet   { --ed-sec-ink: var(--ed-violet); }
.ed-sec--teal     { --ed-sec-ink: #0f9576; }
.ed-sec--amber    { --ed-sec-ink: var(--ed-warning); }
.ed-sec--rust     { --ed-sec-ink: #c2562f; }
.ed-sec--slate    { --ed-sec-ink: #4b5563; }
.ed-sec--olive    { --ed-sec-ink: #6f7f21; }
.ed-sec--forest   { --ed-sec-ink: #2f7d4f; }
.ed-sec--bronze   { --ed-sec-ink: #8a6a20; }
.ed-sec--indigo   { --ed-sec-ink: #4a3fb0; }
.ed-sec--burgundy { --ed-sec-ink: #9b2c3b; }

/* Sur fond sombre, ces trois teintes manquent de luminosite. */
body.dark-skin .ed-sec--rust     { --ed-sec-ink: #e8865c; }
body.dark-skin .ed-sec--slate    { --ed-sec-ink: #94a3b8; }
body.dark-skin .ed-sec--olive    { --ed-sec-ink: #b6c85a; }
body.dark-skin .ed-sec--forest   { --ed-sec-ink: #5cc182; }
body.dark-skin .ed-sec--bronze   { --ed-sec-ink: #cfa646; }
body.dark-skin .ed-sec--indigo   { --ed-sec-ink: #9a93f2; }
body.dark-skin .ed-sec--burgundy { --ed-sec-ink: #e07a86; }

/* Pages non converties : le filet ne porte que le titre. La règle
   `.ed-sec > .card-description` ci-dessus est plus spécifique, elle
   reprend donc la main dès qu'une section existe. */
/* Uniquement les <p> : la classe est aussi posée sur des conteneurs
   (la carte cadastrale par exemple), qui ne sont pas des titres et
   afficheraient un filet orphelin. */
p.card-description {
	border-left: 3px solid var(--ed-primary);
	padding-left: .6rem;
	border-bottom: 0;
	color: var(--ed-primary) !important;
}

.ed-sec > p.card-description { border-left: 0; padding-left: 0; }

/* ------------------------------------------------------------------
   26 · En-tête de modale teinté
   ------------------------------------------------------------------ */
/* Le rognage qui arrondissait les angles coupait aussi les menus Select2
   ouverts pres du bas. L'en-tete portant desormais ses propres arrondis,
   le conteneur n'a plus besoin de rogner. */
.modal-content { overflow: visible !important; }

.modal-header {
	background: var(--ed-banner) !important;
	border-bottom-color: transparent !important;
	/* Barre plus basse : le titre n'a pas besoin de la hauteur d'origine,
	   prevue pour un fond de la meme couleur que le corps. */
	padding: .72rem 1.25rem !important;
	/* La bordure claire de la modale passait devant le bleu et dessinait
	   un lisere blanc dans les angles : l'en-tete la recouvre, le
	   debordement etant deja rogne par `overflow: hidden`. */
	margin: -1px -1px 0 !important;
	border-top-left-radius: var(--ed-r-xl);
	border-top-right-radius: var(--ed-r-xl);
}

.modal-header .btn-close { width: 28px; height: 28px; }

.modal-title { color: #fff; }

/* La croix de Bootstrap est une image noire : elle est inversée plutôt
   que recolorée, la couleur ne pouvant pas l'atteindre. */
.modal-header .btn-close {
	filter: invert(1) grayscale(1) brightness(2);
	opacity: .8;
}

.modal-header .btn-close:hover { background-color: rgba(255, 255, 255, .18); opacity: 1; }

/* En mode sombre, la règle générale des surfaces de modale l'emporterait
   sur la couleur du bandeau : elle est reprise ici, un cran plus sombre. */
body.dark-skin { --ed-banner: #1e3080; }
body.dark-skin .modal-header { background: var(--ed-banner) !important; border-bottom-color: transparent !important; }
body.dark-skin .modal-header .modal-title { color: #fff !important; }

/* Bouton d'ajout posé dans un titre de section */
.ed-sec-add,
.card-description .ed-sec-add {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	margin-left: .4rem;
	border-radius: var(--ed-r-xs);
	background: var(--ed-sec-ink, var(--ed-primary));
	color: #fff !important;
	font-size: .62rem;
	vertical-align: middle;
	transition: filter .13s var(--ed-ease);
}

.ed-sec-add:hover { filter: brightness(1.12); color: #fff !important; }
.ed-sec-add i { font-size: .62rem; }

/* ------------------------------------------------------------------
   27 · Fiche d'appel (cases_survey_call)
   Deux sections a filet : « Informations », dont les quatre blocs sont
   poses sur un panneau gris, et « Sondage », dont le filet court sur
   toute la hauteur des questions. Les deux zones ne se confondent plus.
   ------------------------------------------------------------------ */
/* Le panneau est un `col-12` dans une rangee, exactement comme les
   sections : c'est ce qui garantit qu'il partage leur boite et s'aligne
   avec les questions. Sa gouttiere de colonne devient sa marge interne. */
.ed-call-head {
	background: var(--ed-surface-3);
	border-radius: var(--ed-r-lg);
	padding: .95rem .75rem;
	margin-bottom: 1.2rem;
}

.ed-call-item + .ed-call-item { border-left: 1px solid var(--ed-border); }

.ed-call-item-title {
	margin: 0 0 .5rem;
	font-size: .67rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--ed-text-muted);
}

.ed-kv { margin: 0; font-size: .84rem; line-height: 1.45; }

.ed-kv dt {
	margin-top: .5rem;
	font-size: .68rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--ed-text-muted);
}

.ed-kv dt:first-child { margin-top: 0; }
.ed-kv dd { margin: 0; color: var(--ed-text); font-weight: 500; }
.ed-kv dd + dd { margin-top: .15rem; }
.ed-kv-strong { font-weight: 700 !important; }
.ed-kv-phone { color: var(--ed-text-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ed-kv-out { color: var(--ed-primary); }
.ed-kv-in  { color: #0f9576; }

.ed-call-action { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }

.ed-timer {
	font-size: 1rem;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	color: var(--ed-text);
	background: var(--ed-surface);
	border: 1px solid var(--ed-border);
	border-radius: var(--ed-r-sm);
	padding: .22rem .6rem;
	line-height: 1.35;
}

/* Questions du sondage : le fond vert plein d'origine ecrasait la modale.
   Elles deviennent des cartes, le filet de la section « Sondage » les
   coiffant toutes. */
.question {
	/* Sans cela, la rangee etire chaque colonne a la meme hauteur et la
	   carte se prolonge dans le vide sous les questions les plus courtes. */
	align-self: flex-start;
	border: 1px solid var(--ed-border);
	border-radius: var(--ed-r-lg);
	background: var(--ed-surface);
	box-shadow: var(--ed-shadow-xs);
	padding: .9rem !important;
}

@media (min-width: 768px) {
	/* La marge reprend exactement la gouttiere d'une colonne Bootstrap
	   (12 px), sans quoi les cartes debordent du bandeau de contexte. */
	.question { width: calc(25% - 1.5rem); margin: 0 .75rem 1.1rem; }
}

@media (max-width: 767px) {
	.question { margin-bottom: .9rem; }
	.ed-call-item + .ed-call-item { border-left: 0; border-top: 1px solid var(--ed-border); padding-top: .8rem; margin-top: .8rem; }
}

/* Surtout pas de `display: flex` ici : chaque balise de l'intitule
   deviendrait un element de la rangee, et un mot en gras se detacherait
   du reste de la phrase. Le numero flotte, ce qui laisse la phrase
   couler autour de lui sans toucher a son enchainement. */
.question p.bg-success {
	background: var(--ed-primary-soft) !important;
	color: var(--ed-text) !important;
	font-weight: 600;
	/* Les marges negatives font courir la teinte jusqu'aux bords de la carte.
	   Le `width: 100%` de la colonne doit sauter : une largeur imposee ne
	   s'etire pas, les marges ne feraient que decaler le bloc vers la gauche. */
	width: auto !important;
	max-width: none;
	margin: -.9rem -.9rem .8rem;
	padding: .7rem .85rem !important;
	border-bottom: 1px solid var(--ed-border);
	border-radius: calc(var(--ed-r-lg) - 1px) calc(var(--ed-r-lg) - 1px) 0 0;
	overflow: hidden;
}

/* Le numero devient un grand chiffre, sans pastille. */
.question .drop-cap {
	float: left;
	width: auto;
	height: auto;
	margin: 0 .55rem 0 0;
	padding: 0;
	border-radius: 0;
	background: none;
	color: var(--ed-primary);
	/* Hauteur d'oeil calee sur les deux lignes de texte : sommet du chiffre
	   sur le haut de la premiere, base sur le bas de la seconde. La marge
	   negative compense le demi-interligne qui le poussait vers le bas. */
	font-size: 3.62rem !important;
	font-weight: 800;
	line-height: 1;
	margin-top: -.34rem !important;
	letter-spacing: -.03em;
}

/* Les reponses occupent deja la largeur de la carte : la colonne interne
   n'a plus besoin de sa gouttiere. */
.question .form-group { padding-left: 0; padding-right: 0; }
