/* ============================================================================
   MB ACADÉMIE — DESIGN DE L'APPLICATION (refonte visuelle, octobre 2026)
   Charte graphique appliquée à l'interface, chargée en tout dernier :
   · fond blanc, zones en gris clair #F7F8FA, angle signature (haut droit 5×) ;
   · barre latérale et bandeaux en bleu nuit #101C32 (25 % de la surface) ;
   · accroche en capitales espacées + trait orange 56 × 4 px dessous ;
   · titres Montserrat ExtraBold en phrase, mot clé en bleu #2454CE ;
   · titres courts de bandeau en Couture capitales, mot clé en bleu clair ;
   · textes, navigation et boutons en Helvetica / Arial ;
   · pictogrammes au trait dans des pastilles blanches ; jamais d'émoji ;
   · orange uniquement en repère (trait, point, barre active).
   ========================================================================== */
:root {
  --d-night: #101c32;
  --d-night-2: #183680;
  --d-blue: #2454ce;
  --d-blue-hover: #1c43a8;
  --d-sky: #bfdbfe;
  --d-orange: #f97316;
  --d-text: #334155;
  --d-muted: #556378;
  --d-page: #ffffff;
  --d-zone: #f7f8fa;
  --d-zone-2: #eef2f8;
  --d-tile: #ffffff;
  --d-line: #e2e8f0;
  --d-angle: 14px 56px 14px 14px;
  --d-angle-sm: 10px 30px 10px 10px;
  --d-title: 'Montserrat Brand', Montserrat, Helvetica, Arial, sans-serif;
  --d-display: 'Couture', 'Montserrat Brand', Montserrat, Helvetica, Arial, sans-serif;
  --d-text-font: Helvetica, Arial, sans-serif;
  --d-band: radial-gradient(120% 140% at 100% 100%, rgba(249, 115, 22, .32) 0%, rgba(249, 115, 22, 0) 42%), radial-gradient(80% 120% at 0% 0%, rgba(36, 84, 206, .35) 0%, rgba(36, 84, 206, 0) 55%), linear-gradient(135deg, #101c32 0%, #183680 100%);
}
[data-theme="dark"] {
  --d-text: #d5deea;
  --d-muted: #a3b1c6;
  --d-page: #0b1426;
  --d-zone: #101c32;
  --d-zone-2: #17274a;
  --d-tile: #13213d;
  --d-line: #22345a;
}

/* ── 1. Fond et texte ──────────────────────────────────────────────────────── */
html body:is(.admin-workspace, .member-workspace) { background: var(--d-page) !important; color: var(--d-text); font-family: var(--d-text-font); }
html body.admin-workspace :is(.admin-main, .admin-layout) { background: var(--d-page) !important; }
html body.member-workspace .member-layout { background: var(--d-page) !important; }

/* ── 2. Barre latérale bleu nuit ───────────────────────────────────────────── */
html body.admin-workspace .admin-sidebar {
  background: var(--d-night) !important; border-right: 0 !important; box-shadow: none !important; color: #fff;
}
html body.admin-workspace .admin-sidebar-brand { border-bottom: 1px solid rgba(255, 255, 255, .08) !important; }
html body.admin-workspace .admin-sidebar-brand span { color: #fff !important; font: 600 15px/1.1 var(--d-title) !important; letter-spacing: .04em !important; text-transform: uppercase; }
html body.admin-workspace .admin-sidebar-brand small { color: var(--d-sky) !important; opacity: .75; letter-spacing: .18em !important; }
html body.admin-workspace .admin-sidebar-brand img { background: #fff; border-radius: 50%; padding: 3px; }
html body.admin-workspace :is(.admin-nav-section-title, .admin-nav-section > span, .admin-sidebar-nav h3, .admin-nav-group-title, .admin-sidebar-nav summary, .admin-nav-section-label) {
  color: rgba(191, 219, 254, .62) !important; font: 700 12px/1 var(--d-text-font) !important; letter-spacing: .16em !important; text-transform: uppercase;
}
html body.admin-workspace .admin-nav-link {
  position: relative; color: rgba(255, 255, 255, .78) !important; background: transparent !important; border-radius: 10px !important;
  font: 400 14px/1.2 var(--d-text-font) !important; box-shadow: none !important;
}
html body.admin-workspace .admin-nav-link :is(svg, .admin-nav-icon, .admin-nav-icon svg) { color: rgba(191, 219, 254, .7) !important; background: transparent !important; box-shadow: none !important; }
html body.admin-workspace .admin-nav-link .admin-nav-label { text-transform: none !important; letter-spacing: 0 !important; font: inherit !important; color: inherit !important; }
html body.admin-workspace .admin-nav-link:hover { color: #fff !important; background: rgba(255, 255, 255, .06) !important; }
html body.admin-workspace .admin-nav-link.active { color: #fff !important; background: rgba(255, 255, 255, .1) !important; font-weight: 700 !important; }
html body.admin-workspace .admin-nav-link.active svg, html body.admin-workspace .admin-nav-link.active .admin-nav-icon { color: #fff !important; }
html body.admin-workspace .admin-nav-link.active::before { content: ""; position: absolute; left: -12px; top: 9px; bottom: 9px; width: 4px; border-radius: 0 4px 4px 0; background: var(--d-orange); }
html body.admin-workspace .admin-nav-link :is(.admin-nav-badge, .admin-nav-count, .badge) { background: var(--d-blue) !important; color: #fff !important; box-shadow: none !important; }
html body.admin-workspace .admin-sidebar-footer { border-top: 1px solid rgba(255, 255, 255, .08) !important; background: transparent !important; }
html body.admin-workspace :is(.admin-user-name) { color: #fff !important; }
html body.admin-workspace :is(.admin-user-role) { color: var(--d-sky) !important; }
html body.admin-workspace .admin-user-avatar { background: var(--d-blue) !important; color: #fff !important; }
html body.admin-workspace .admin-sidebar :is(.admin-logout-btn, .admin-sidebar-close, .admin-collapse-btn) { color: rgba(255, 255, 255, .7) !important; background: transparent !important; border-color: rgba(255, 255, 255, .14) !important; }
html body.admin-workspace .admin-sidebar :is(a, button):focus-visible { outline-color: var(--d-sky) !important; }
html body.admin-workspace .admin-sidebar .admin-collapse-btn { border-width: 1px 0 0 !important; border-style: solid !important; }
html body.admin-workspace .admin-sidebar .admin-collapse-btn:hover { color: #fff !important; background: rgba(255, 255, 255, .06) !important; }
/* Le logo, le profil et le bouton de repli ne se tassent jamais : seul le menu défile s'il manque de place. */
html body.admin-workspace .admin-sidebar :is(.admin-sidebar-brand, .admin-sidebar-footer, .admin-collapse-btn) { flex-shrink: 0 !important; }
html body.admin-workspace .admin-sidebar .admin-sidebar-nav { min-height: 0; }
/* Écran d'ordinateur peu haut (portable, 900 px et moins) : tout le menu tient sans défiler,
   pour que « Aujourd'hui » et « Messagerie » ne disparaissent pas en haut de la liste. */
@media (min-width: 1025px) and (max-height: 960px) {
  html body.admin-workspace .admin-sidebar .admin-nav-link { min-height: 36px !important; padding-top: 4px !important; padding-bottom: 4px !important; }
  html body.admin-workspace .admin-sidebar .admin-nav-section { margin-top: 14px !important; }
}

/* ── 3. En-tête : blanc, un filet, l'essentiel ─────────────────────────────── */
html body.admin-workspace .admin-header { background: var(--d-page) !important; border-bottom: 1px solid var(--d-line) !important; box-shadow: none !important; backdrop-filter: none !important; }
html body.admin-workspace #refreshBtn.admin-header-btn { display: none !important; } /* l'actualisation est automatique */
html body.admin-workspace :is(.admin-header-btn, .admin-theme-toggle, .admin-search-trigger) { background: transparent !important; border-color: transparent !important; box-shadow: none !important; color: var(--d-text) !important; }
html body.admin-workspace :is(.admin-header-btn, .admin-theme-toggle, .admin-search-trigger):hover { background: var(--d-zone) !important; }
html body.admin-workspace .admin-search-trigger { border: 1px solid var(--d-line) !important; }
html body.admin-workspace .admin-header-profile-btn { background: transparent !important; border-color: transparent !important; box-shadow: none !important; }
html body.admin-workspace .admin-header-avatar { background: var(--d-blue) !important; color: #fff !important; }
html body.admin-workspace .admin-breadcrumb { font-size: 13px; }

/* ── 4. En-tête de page : accroche + trait orange, titre au mot clé bleu ─── */
html body.admin-workspace .admin-content, html body.member-workspace .member-content { padding-top: 32px !important; }
html body .d-kicker {
  display: block; margin: 0 0 10px; color: var(--d-blue); font: 700 12.5px/1 var(--d-text-font); letter-spacing: .16em; text-transform: uppercase;
}
html body .d-kicker::after { content: ""; display: block; width: 56px; height: 4px; margin-top: 10px; border-radius: 2px; background: var(--d-orange); }
html[data-theme="dark"] body:not(.d-none) .d-kicker { color: var(--d-sky); }
html body .d-key { color: var(--d-blue); }
html[data-theme="dark"] body:not(.d-none) .d-key { color: var(--d-sky); }
html body.admin-workspace .workspace-heading { align-items: flex-end !important; margin: 0 0 28px !important; padding: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important; }
html body.admin-workspace .workspace-heading h1, html body.member-workspace .member-content h1:not(.d-band-title):not(.mh-hero h1):not(.tp-hero h1):not(.fl-hero h1):not(.tc h1) {
  font: 800 clamp(28px, 2.6vw, 38px)/1.1 var(--d-title) !important; letter-spacing: -.02em !important; color: var(--d-night) !important; text-transform: none !important; margin: 0 !important;
}
html[data-theme="dark"] body:not(.d-none).admin-workspace .workspace-heading h1, html[data-theme="dark"] body:not(.d-none).member-workspace .member-content h1:not(.d-band-title):not(.mh-hero h1):not(.tp-hero h1):not(.fl-hero h1):not(.tc h1) { color: #fff !important; }
html body.admin-workspace .workspace-description, html body.member-workspace .member-page-heading > div > p { display: none !important; }
/* Accroches existantes de l'espace membre : même dessin que .d-kicker. */
html body.member-workspace :is(.member-eyebrow, .mh-kicker, .tp-kicker, .mm-now-kicker) { display: block !important; margin: 0 0 12px !important; padding: 0 !important; background: none !important; border: 0 !important; color: var(--d-blue) !important; font: 700 12.5px/1 var(--d-text-font) !important; letter-spacing: .16em !important; text-transform: uppercase !important; }
html body.member-workspace :is(.member-eyebrow, .mh-kicker, .tp-kicker)::after { content: ""; display: block; width: 56px; height: 4px; margin-top: 10px; border-radius: 2px; background: var(--d-orange); }
html body.member-workspace :is(.mh-hero, .tp-hero) :is(.mh-kicker, .tp-kicker) { color: var(--d-sky) !important; }
html[data-theme="dark"] body:not(.d-none).member-workspace .member-eyebrow { color: var(--d-sky) !important; }
html body.admin-workspace .workspace-eyebrow { display: none !important; }
html body.admin-workspace .x-help summary { width: 26px !important; height: 26px !important; border-radius: 50% !important; background: var(--d-zone) !important; border: 0 !important; color: var(--d-muted) !important; font-size: 13px !important; }
html body.admin-workspace .x-welcome-line { display: none !important; } /* « Pour commencer » : l'aide « ? » suffit */

/* ── 5. Zones : gris clair, angle signature, ni bordure ni ombre ───────────── */
html body.admin-workspace :is(.admin-card, .dash-card, .admin-stats-grid, .workspace-panel, .crm-list, .x-panel, .invoice-kpis, .eval-kpis, .emarg-kpis, .pl-kpis, .training-summary, .dash-kpis, .admin-table-card, .session-card, .training-card, .settings-card, .complaints-card, .tc),
html body.member-workspace :is(.member-card, .mm-item, .quote-card, .member-appointment-card, .mf-item, .mm-card, .mm-dayj, .member-review-card) {
  background: var(--d-zone) !important; border: 0 !important; box-shadow: none !important; border-radius: var(--d-angle) !important;
}
html body.admin-workspace :is(.dash-card, .admin-card) { padding: 22px 24px !important; }
html body.admin-workspace .dash-card-head p, html body.admin-workspace .admin-card-header p, html body.member-workspace .member-card-header p { display: none !important; } /* sous-titres de cartes : le titre suffit */
html body.admin-workspace :is(.dash-card-head h2, .admin-card-title, .admin-card-header h2, .admin-card-header h3), html body.member-workspace :is(.member-card-title, .mm-section > h2, .mf-section, .member-content h2) {
  font: 800 19px/1.25 var(--d-title) !important; color: var(--d-night) !important; letter-spacing: -.01em !important; text-transform: none !important;
}
html[data-theme="dark"] body:not(.d-none) :is(.dash-card-head h2, .admin-card-title, .admin-card-header h2, .admin-card-header h3, .member-card-title, .mm-section > h2, .mf-section, .member-content h2) { color: #fff !important; }
html body.admin-workspace .dash-go { background: var(--d-tile) !important; border: 1px solid var(--d-line) !important; color: var(--d-blue) !important; border-radius: 50% !important; }

/* ── 6. Indicateurs : grands chiffres, sans cadre ni pictogramme ───────────── */
html body.admin-workspace :is(.admin-stats-grid, .dash-kpis, .invoice-kpis, .eval-kpis, .emarg-kpis, .pl-kpis) { gap: 0 !important; padding: 6px !important; }
html body.admin-workspace :is(.admin-stat-card, .dash-kpi, .invoice-kpi, .eval-kpi, .emarg-kpi, .pl-kpi) {
  background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; padding: 16px 20px !important;
}
html body.admin-workspace :is(.admin-stat-card, .dash-kpi, .invoice-kpi, .eval-kpi, .emarg-kpi, .pl-kpi) + :is(.admin-stat-card, .dash-kpi, .invoice-kpi, .eval-kpi, .emarg-kpi, .pl-kpi) { border-left: 1px solid var(--d-line) !important; }
html body.admin-workspace :is(.admin-stat-icon, .dash-kpi-icon, .dash-kpi-ico, .dash-kpi-go, .dash-kpi > i, .dash-kpi-label svg, .admin-stat-card svg, .dash-kpi > svg, .dash-kpi-head svg) { display: none !important; }
html body.admin-workspace :is(.admin-stat-value, .dash-kpi-value, .dash-kpi strong, .invoice-kpi strong, .eval-kpi strong) { font: 800 30px/1.1 var(--d-title) !important; color: var(--d-night) !important; letter-spacing: -.02em !important; }
html[data-theme="dark"] body:not(.d-none).admin-workspace :is(.admin-stat-value, .dash-kpi-value, .dash-kpi strong, .invoice-kpi strong, .eval-kpi strong) { color: #fff !important; }
html body.admin-workspace :is(.admin-stat-label, .dash-kpi-label, .dash-kpi-head, .dash-kpi > span:first-child) { color: var(--d-muted) !important; font: 700 12px/1.3 var(--d-text-font) !important; letter-spacing: .08em !important; text-transform: uppercase; }
html body.admin-workspace :is(.dash-kpi, .admin-stat-card)::after, html body.admin-workspace :is(.dash-kpi, .admin-stat-card)::before { display: none !important; content: none !important; }
html body.admin-workspace .today-kpi-value { font: 800 32px/1.1 var(--d-title) !important; color: var(--d-night) !important; letter-spacing: -.02em !important; }
html[data-theme="dark"] body:not(.d-none).admin-workspace .today-kpi-value { color: #fff !important; }
html body.admin-workspace .dash-kpi-sub { color: var(--d-muted) !important; font-size: 13px !important; }
html body.admin-workspace :is(.admin-stat-bar, .admin-stat-progress, .dash-kpi-bar) { display: none !important; }

/* ── 7. Lignes de liste : tuiles blanches dans la zone grise ───────────────── */
html body.admin-workspace .dash-todo-row, html body.member-workspace .mm-list > .mm-item {
  background: var(--d-tile) !important; border: 0 !important; border-radius: 12px !important; box-shadow: none !important; margin-bottom: 8px;
}
html body.admin-workspace .dash-todo { gap: 0 !important; }
html body.admin-workspace .dash-todo-row:hover { box-shadow: 0 0 0 1px var(--d-blue) inset !important; transform: none !important; }
html body.admin-workspace .dash-todo-icon, html body.member-workspace :is(.mm-date-icon, .member-quick-action-icon) {
  background: var(--d-tile) !important; border: 1px solid var(--d-line) !important; color: var(--d-blue) !important; border-radius: 50% !important;
}
html body.admin-workspace .dash-todo-row strong { font: 700 15px/1.3 var(--d-text-font) !important; color: var(--d-night) !important; }
html[data-theme="dark"] body:not(.d-none).admin-workspace .dash-todo-row strong { color: #fff !important; }
html body.admin-workspace .dash-todo-go { color: var(--d-blue) !important; }

/* ── 8. Tableaux : clairs, en-têtes discrets ───────────────────────────────── */
html body.admin-workspace .admin-table { background: transparent !important; border-collapse: separate !important; border-spacing: 0 6px !important; }
html body.admin-workspace .admin-table thead th { background: transparent !important; border: 0 !important; color: var(--d-muted) !important; font: 700 12px/1 var(--d-text-font) !important; letter-spacing: .1em !important; text-transform: uppercase; padding: 8px 16px !important; }
html body.admin-workspace .admin-table tbody tr { background: var(--d-tile) !important; box-shadow: none !important; }
html body.admin-workspace .admin-table tbody td { border: 0 !important; padding: 14px 16px !important; }
html body.admin-workspace .admin-table tbody td:first-child { border-radius: 10px 0 0 10px; }
html body.admin-workspace .admin-table tbody td:last-child { border-radius: 0 10px 10px 0; }
/* Survol d'une ligne : un seul contour, arrondi comme la tuile (posé sur les cellules, pas sur la ligne). */
html body.admin-workspace .admin-table tbody tr:is(:hover, :focus-within) { box-shadow: none !important; outline: 0 !important; }
html body.admin-workspace .admin-table tbody tr:is(:hover, :focus-within) > td { box-shadow: inset 0 1px 0 var(--d-blue), inset 0 -1px 0 var(--d-blue) !important; }
html body.admin-workspace .admin-table tbody tr:is(:hover, :focus-within) > td:first-child { box-shadow: inset 1px 1px 0 var(--d-blue), inset 0 -1px 0 var(--d-blue) !important; }
html body.admin-workspace .admin-table tbody tr:is(:hover, :focus-within) > td:last-child { box-shadow: inset -1px 1px 0 var(--d-blue), inset 0 -1px 0 var(--d-blue) !important; }
html body.admin-workspace .admin-table tbody tr:is(:hover, :focus-within) > td:only-child { box-shadow: inset 0 0 0 1px var(--d-blue) !important; }
html[data-theme="dark"] body.admin-workspace .admin-table tbody tr:is(:hover, :focus-within) > td { --d-blue: #8fb0ff; }

/* ── 9. Bandeau de marque (accueils) : bleu nuit dégradé, Couture capitales ── */
html body .d-band {
  position: relative; overflow: hidden; background: var(--d-band) !important; color: #fff !important; border: 0 !important; box-shadow: none !important;
  border-radius: 16px 80px 16px 16px !important; padding: 34px 40px !important;
}
html body .d-band :is(h1, .d-band-title) {
  font: 700 clamp(30px, 3.4vw, 48px)/1 var(--d-display) !important; letter-spacing: .01em !important; text-transform: uppercase !important; color: #fff !important; margin: 0 !important;
}
html body .d-band :is(h1, .d-band-title) .d-key { color: var(--d-sky) !important; }
html body .d-band .d-kicker { color: var(--d-sky); }
html body .d-band :is(p, span:not(.d-key):not(.d-kicker)) { color: rgba(255, 255, 255, .86) !important; }
html body .d-band .d-pills { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 16px 0 0; padding: 0; list-style: none; font: 700 12.5px/1.4 var(--d-text-font); letter-spacing: .14em; text-transform: uppercase; color: #fff; }
html body .d-band .d-pills li { display: inline-flex; align-items: center; gap: 22px; }
html body .d-band .d-pills li + li::before { content: ""; width: 7px; height: 7px; margin-left: -22px; margin-right: -8px; border-radius: 50%; background: var(--d-orange); }
html body .d-band .d-pills b { font-size: 20px; letter-spacing: 0; margin-right: 6px; color: var(--d-sky); }
html body .d-band :is(.admin-btn-primary, .member-btn:not(.member-btn-secondary)) { background: #fff !important; color: var(--d-night) !important; border-color: #fff !important; }
html body .d-band :is(.admin-btn-secondary, .member-btn-secondary, .today-quick-btn:not(.is-primary)) { background: rgba(255, 255, 255, .08) !important; color: #fff !important; border: 1px solid rgba(255, 255, 255, .28) !important; }

/* ── 10. Accueil de l'équipe (Aujourd'hui) : l'essentiel d'abord ──────────── */
html body.admin-workspace .today-page { display: flex !important; flex-direction: column; gap: 22px; }
html body.admin-workspace .today-page > .today-hero { order: 1; }
html body.admin-workspace .today-page > .dash-kpis { order: 2; }
html body.admin-workspace .today-page > .dash-row-main { order: 3; }
html body.admin-workspace .today-page > .dash-row-3 { order: 4; }
html body.admin-workspace .today-page > * { margin: 0 !important; }
html body.admin-workspace .today-hero .today-quick, html body.admin-workspace .today-role { display: none !important; } /* « Créer » est dans l'en-tête */
html body.admin-workspace .today-hero .today-date { display: block !important; color: var(--d-sky) !important; font: 700 12.5px/1 var(--d-text-font) !important; letter-spacing: .16em !important; text-transform: uppercase; margin: 0 0 14px !important; }
html body.admin-workspace .today-hero .today-date::after { content: ""; display: block; width: 56px; height: 4px; margin-top: 10px; border-radius: 2px; background: var(--d-orange); }
html body.admin-workspace .today-hero .today-summary { margin-top: 12px !important; font-size: 16px !important; }
html body.admin-workspace .dash-row-3 .dash-card { background: transparent !important; border: 1px solid var(--d-line) !important; }

/* ── 11. Boutons : flèche simple sur les liens d'action principaux ────────── */
html body :is(a.admin-btn-primary, a.member-btn:not(.member-btn-secondary):not(.member-btn-danger), a.today-quick-btn.is-primary):not(:has(svg))::after { content: "→"; margin-left: 8px; font-weight: 700; }
html body :is(.admin-btn-secondary, .member-btn-secondary) { background: var(--d-page) !important; border: 1px solid var(--d-line) !important; color: var(--d-night) !important; }
html[data-theme="dark"] body:not(.d-none) :is(.admin-btn-secondary, .member-btn-secondary) { color: #fff !important; }

/* ── 12. Espace membre : navigation et pages ───────────────────────────────── */
html body.member-workspace .member-navbar { background: var(--d-night) !important; border-bottom: 0 !important; box-shadow: none !important; }
html body.member-workspace .member-navbar-brand :is(span, strong) { color: #fff !important; font: 600 15px/1 var(--d-title) !important; letter-spacing: .04em !important; text-transform: uppercase; }
html body.member-workspace .member-navbar-brand img { background: #fff; border-radius: 50%; padding: 3px; }
html body.member-workspace .member-role-chip { background: var(--d-orange) !important; color: var(--d-night) !important; }
html body.member-workspace .member-nav-link { color: rgba(255, 255, 255, .78) !important; background: transparent !important; font: 400 14px/1 var(--d-text-font) !important; position: relative; }
html body.member-workspace .member-nav-link svg { color: rgba(191, 219, 254, .75) !important; }
html body.member-workspace .member-nav-link:hover { color: #fff !important; background: rgba(255, 255, 255, .06) !important; }
html body.member-workspace .member-nav-link.active { color: #fff !important; background: rgba(255, 255, 255, .1) !important; font-weight: 700 !important; }
html body.member-workspace .member-nav-link.active::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: -2px; height: 3px; border-radius: 2px; background: var(--d-orange); }
html body.member-workspace .member-nav-link.active svg { color: #fff !important; }
html body.member-workspace :is(.member-back-link, .member-theme-toggle, .member-logout-btn, .member-nav-toggle) { background: transparent !important; color: rgba(255, 255, 255, .85) !important; border: 1px solid rgba(255, 255, 255, .2) !important; }
@media (max-width: 1100px) {
  html body.member-workspace .member-nav-links { background: var(--d-night) !important; }
}
/* Espace formateur : barre latérale à gauche sur ordinateur, comme le back-office.
   Le rôle est connu dès le chargement (html[data-member-nav], voir js/member/common.js). */
html body.member-workspace .member-nav-group { margin: 14px 0 4px; padding: 0 14px; color: rgba(191, 219, 254, .75); font: 700 11px/1 var(--d-text-font); letter-spacing: .16em; text-transform: uppercase; }
html body.member-workspace .member-nav-group:first-child { margin-top: 0; }
@media (min-width: 1281px) {
  html[data-member-nav="trainer"] body.member-workspace { --member-sidebar: 260px; --navbar-height: 0px; padding-left: var(--member-sidebar); }
  html[data-member-nav="trainer"] body.member-workspace .member-navbar { position: fixed !important; inset: 0 auto 0 0; z-index: 100; width: var(--member-sidebar); height: auto; display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0; padding: 0; overflow: hidden; }
  html[data-member-nav="trainer"] body.member-workspace .member-navbar-brand { flex-shrink: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0; padding: 22px 20px 20px; border-bottom: 1px solid rgba(255, 255, 255, .08); }
  html[data-member-nav="trainer"] body.member-workspace .member-role-chip { margin-left: 0; }
  html[data-member-nav="trainer"] body.member-workspace .member-nav-toggle { display: none !important; }
  html[data-member-nav="trainer"] body.member-workspace .member-nav-links { flex: 1 1 auto; min-height: 0; display: flex !important; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 2px; margin: 0; padding: 18px 12px; overflow-y: auto; }
  html[data-member-nav="trainer"] body.member-workspace .member-nav-group { margin-top: 18px; }
  html[data-member-nav="trainer"] body.member-workspace .member-nav-group:first-child { margin-top: 0; }
  html[data-member-nav="trainer"] body.member-workspace .member-nav-link { width: 100%; justify-content: flex-start; gap: 12px; min-height: 42px; padding: 10px 14px !important; border-radius: 10px; font-size: 15px !important; white-space: nowrap; }
  html[data-member-nav="trainer"] body.member-workspace .member-nav-link .member-nav-badge { margin-left: auto; }
  html[data-member-nav="trainer"] body.member-workspace .member-nav-link.active::after { left: -12px; right: auto; top: 9px; bottom: 9px; width: 4px; height: auto; border-radius: 0 4px 4px 0; }
  html[data-member-nav="trainer"] body.member-workspace .member-nav-right { flex-shrink: 0; display: flex; align-items: center; gap: 8px; margin: 0; padding: 14px 12px 18px; border-top: 1px solid rgba(255, 255, 255, .08); }
  html[data-member-nav="trainer"] body.member-workspace .member-logout-btn { flex: 1; justify-content: center; }
}
html body.member-workspace .member-page-heading { align-items: flex-end !important; margin-bottom: 28px !important; }
html body.member-workspace .member-tabs, html body.member-workspace .member-tab-list { background: transparent !important; border: 0 !important; box-shadow: none !important; border-bottom: 1px solid var(--d-line) !important; border-radius: 0 !important; padding: 0 !important; }
html body.member-workspace .member-tab.active { color: var(--d-blue) !important; border-bottom: 3px solid var(--d-blue) !important; }
/* Accueil client : bandeau de marque. */
html body.member-workspace :is(.mh-hero, .member-welcome) { background: var(--d-band) !important; border-radius: 16px 80px 16px 16px !important; box-shadow: none !important; }
html body.member-workspace :is(.mh-hero, .member-welcome, .tp-hero) h1 { font: 700 clamp(30px, 3.4vw, 46px)/1 var(--d-display) !important; text-transform: uppercase !important; color: #fff !important; letter-spacing: .01em !important; }
html body.member-workspace :is(.mh-hero, .member-welcome, .tp-hero) h1 :is(span, em, .mh-name) { color: var(--d-sky) !important; }
html body.member-workspace :is(.mh-hero, .tp-hero) :is(p, span:not(.mh-name)) { color: rgba(255, 255, 255, .86) !important; }
html body.member-workspace .mh-hero { padding: 34px 40px !important; }
/* Encarts vides : une ligne, pas une grande carte. */
html body.member-workspace :is(.mh-empty, .mm-empty) { padding: 12px 0 !important; min-height: 0 !important; text-align: left !important; }
html body.member-workspace :is(.mh-empty-icon, .tp-empty-icon) { display: none !important; }
html body #memberVersionNotice { border-radius: 10px !important; }
/* Formateur : bandeau de mission. */
html body.member-workspace :is(.tp-hero) { background: var(--d-band) !important; border-radius: 16px 80px 16px 16px !important; box-shadow: none !important; color: #fff !important; }

/* ── 13. Repères de marque et pastilles d'état ─────────────────────────────── */
html body :is(.admin-badge, .mm-state, .dash-chip, .member-badge) { border-radius: 999px !important; font: 700 12px/1 var(--d-text-font) !important; letter-spacing: .02em !important; }

/* ── 14. Téléphone ─────────────────────────────────────────────────────────── */
@media (max-width: 760px) {
  html body .d-band { padding: 24px 22px !important; border-radius: 14px 48px 14px 14px !important; }
  html body.admin-workspace :is(.admin-stat-card, .dash-kpi, .invoice-kpi, .eval-kpi, .emarg-kpi, .pl-kpi) + :is(.admin-stat-card, .dash-kpi, .invoice-kpi, .eval-kpi, .emarg-kpi, .pl-kpi) { border-left: 0 !important; }
  html body.admin-workspace .workspace-heading { margin-bottom: 20px !important; }
}

/* ── 15. Accueils membre : bandeau lisible, listes en tuiles ───────────────── */
html body.member-workspace .member-content :is(.mh-hero, .tp-hero) h1, html body.member-workspace .member-content :is(.mh-hero, .tp-hero) h1 * {
  color: #fff !important; -webkit-text-fill-color: currentColor !important; background: none !important;
  font: 700 clamp(30px, 3.4vw, 46px)/1.05 var(--d-display) !important; text-transform: uppercase !important; letter-spacing: .01em !important;
}
html body.member-workspace .member-content :is(.mh-hero, .tp-hero) h1 :is(.mh-name, span) { color: var(--d-sky) !important; }
html body.member-workspace .member-content .mm-section > h2 {
  font: 800 20px/1.25 var(--d-title) !important; letter-spacing: -.01em !important; text-transform: none !important; color: var(--d-night) !important; padding: 0 !important; border: 0 !important; margin: 26px 0 12px !important;
}
html body.member-workspace .member-content .mm-section > h2::before, html body.member-workspace .member-content .mm-section > h2::after { display: none !important; }
html body.member-workspace .member-content .mm-section > h2 em { background: var(--d-blue) !important; color: #fff !important; font: 700 12px/20px var(--d-text-font) !important; min-width: 22px; text-align: center; border-radius: 999px !important; padding: 0 7px !important; }
html[data-theme="dark"] body:not(.d-none).member-workspace .member-content .mm-section > h2 { color: #fff !important; }
html body.member-workspace .member-content .mm-list { gap: 8px !important; }
html body.member-workspace .member-content .mm-list > .mm-item {
  background: var(--d-zone) !important; border: 0 !important; border-radius: var(--d-angle-sm) !important; box-shadow: none !important; padding: 16px 20px !important;
}
html body.member-workspace .member-content .mm-list > .mm-item::before { display: none !important; }
html body.member-workspace .member-content .mm-date { background: var(--d-night) !important; color: #fff !important; border-radius: 10px !important; box-shadow: none !important; }
html body.member-workspace .member-content .mm-date.mm-date-icon { background: #fff !important; color: var(--d-blue) !important; border: 1px solid var(--d-line) !important; border-radius: 50% !important; }
html[data-theme="dark"] body:not(.d-none).member-workspace .member-content .mm-date.mm-date-icon { background: var(--d-tile) !important; }
html body.member-workspace .member-content .mm-now { background: var(--d-zone) !important; border: 0 !important; box-shadow: none !important; border-radius: var(--d-angle) !important; }
html body.member-workspace .member-content .mm-now::before { display: none !important; }
html body.member-workspace .member-content .mm-now-step { background: #fff !important; border: 0 !important; border-radius: 12px !important; }
html[data-theme="dark"] body:not(.d-none).member-workspace .member-content .mm-now-step { background: var(--d-tile) !important; }
html body.member-workspace .member-content .mm-now-title { font: 800 24px/1.2 var(--d-title) !important; color: var(--d-night) !important; }
html[data-theme="dark"] body:not(.d-none).member-workspace .member-content .mm-now-title { color: #fff !important; }
html body.member-workspace .member-content .mm-empty { border: 0 !important; background: none !important; color: var(--d-muted) !important; }
html body.member-workspace .member-role-chip { background: transparent !important; color: var(--d-sky) !important; border: 1px solid rgba(191, 219, 254, .5) !important; font: 700 12px/1 var(--d-text-font) !important; letter-spacing: .12em !important; text-transform: uppercase; }
/* Rien de nouveau : une ligne. */
html body.member-workspace .mh-empty :is(strong, p) { display: inline !important; font-size: 14px !important; color: var(--d-muted) !important; margin: 0 !important; }
html body.member-workspace .mh-empty strong { color: var(--d-text) !important; margin-right: 6px !important; }
/* Indicateurs de l'administration : pas de pastilles décoratives vides. */
html body.admin-workspace .admin-stat-card [class*="icon"] { display: none !important; }

/* Bandeau : le trait orange est sous l'accroche, pas en bord ; pas de trame décorative. */
html body .d-band::before, html body .d-band::after, html body.member-workspace :is(.mh-hero, .tp-hero)::before, html body.member-workspace :is(.mh-hero, .tp-hero)::after { display: none !important; }
/* Aplats sans halo lumineux (charte : boutons simples). */
html body :is(.admin-btn, .member-btn, .training-btn, .fl-main, .tc-new, .auth-submit, .p-btn, .btn, .today-quick-btn, .x-create > button) { box-shadow: none !important; }

/* Parcours du jour : même bandeau de marque. */
html body.member-workspace .member-content .fl-hero { background: var(--d-band) !important; border-radius: 16px 64px 16px 16px !important; box-shadow: none !important; }
html body.member-workspace .member-content .fl-hero::after { display: none !important; }
html body.member-workspace .member-content .fl-hero h1 { color: #fff !important; -webkit-text-fill-color: #fff !important; font: 700 clamp(26px, 3vw, 38px)/1.05 var(--d-display) !important; text-transform: uppercase !important; letter-spacing: .01em !important; }
html body.member-workspace .member-content .fl-hero :is(p, span:not(.fl-chip)) { color: rgba(255, 255, 255, .86) !important; }

/* Derniers contrastes : libellés de section du menu, calendrier, flèches en thème sombre. */
html body.admin-workspace .admin-sidebar .admin-nav-section { color: rgba(191, 219, 254, .75) !important; font: 700 12px/1 var(--d-text-font) !important; letter-spacing: .16em !important; text-transform: uppercase; }
html body.admin-workspace .fc .fc-button:not(.fc-button-active) { color: var(--d-night) !important; background: var(--d-page) !important; border: 1px solid var(--d-line) !important; }
html body.admin-workspace .fc .fc-button.fc-button-active, html body.admin-workspace .fc .fc-button-primary:not(:disabled).fc-button-active { color: #fff !important; background: var(--d-blue) !important; border-color: var(--d-blue) !important; }
html[data-theme="dark"] body:not(.d-none) .fc .fc-button:not(.fc-button-active) { color: #fff !important; }
html body.admin-workspace .fc :is(.fc-daygrid-day-number small, .fc-day-today small, .apt-today-badge small) { background: var(--d-blue) !important; }
html[data-theme="dark"] body:not(.d-none) :is(.dash-todo-go, .dash-go) { color: var(--d-sky) !important; }
html[data-theme="dark"] body:not(.d-none) :is(.fl-dot-label, .fl-step-dot.fl-blue) { color: var(--d-sky) !important; }
html[data-theme="dark"] body:not(.d-none) :is(.emarg-status-ok, .dossier-dot) { background: #047857 !important; color: #fff !important; }

/* Accroche de la carte du jour : pas de pastille résiduelle. */
html body.member-workspace .mm-now-kicker .mm-dot { display: none !important; }

/* Pastilles « fait » : vert de la charte étendue, lisible (5,5:1). */
html body :is(.admin-badge.green, .mm-state.is-ok, .mh-state.is-ok, .fl-chip.fl-green) { background: #e3f6ee !important; color: #047857 !important; }
html[data-theme="dark"] body:not(.d-none) :is(.admin-badge.green, .mm-state.is-ok, .mh-state.is-ok, .fl-chip.fl-green) { background: rgba(16, 150, 100, .2) !important; color: #6fd3a2 !important; }

/* Bulles de messagerie : aplat bleu (pas de dégradé), heure lisible. */
html body :is(.team-chat-page, .tc-modal, #composeModal) { --tc-mine: #2454ce !important; }
html body :is(.team-chat-page, .tc) .tc-msg.is-mine .tc-bubble { background: #2454ce !important; background-image: none !important; }
/* Compteurs des filtres de messagerie : jamais sur orange. */
html body :is(.team-chat-page, .tc) .tc-filters b, html body :is(.team-chat-page, .tc) [data-filter] b { background: #2454ce !important; color: #fff !important; }
/* Thème sombre : accroches et onglets actifs en bleu clair. */
html[data-theme="dark"] body:not(.d-none) :is(.mm-now-kicker, .member-tab.active, .d-kicker, .member-eyebrow) { color: var(--d-sky) !important; }
html[data-theme="dark"] body:not(.d-none) .member-tab.active { border-bottom-color: var(--d-sky) !important; }

/* Présence · Participants : bandeau de marque, accroche lisible. */
html body.presence .pl-hero { background: var(--d-band) !important; border-radius: 16px 64px 16px 16px !important; }
html body.presence .pl-hero .p-kicker { background: none !important; padding: 0 !important; color: var(--d-sky) !important; font: 700 12.5px/1 var(--d-text-font) !important; letter-spacing: .16em !important; text-transform: uppercase; }
html body.presence .pl-hero .p-kicker::after { content: ""; display: block; width: 56px; height: 4px; margin-top: 10px; border-radius: 2px; background: var(--d-orange); }
html body.presence .pl-hero h1 { font: 800 clamp(22px, 5vw, 30px)/1.2 var(--d-title) !important; color: #fff !important; }
html body.presence .pl-avatar { background: #2454ce !important; }

/* Pastilles d'état posées sur un bandeau sombre : texte blanc, fond translucide (lisibilité). */
html body:not(.d-none) .d-band.d-band.d-band :is(.fl-chip, .admin-badge, .mm-state, .dash-chip, .pl-state, [class*="tone-"]):not(.d-keep):not(.d-keep) {
  background: rgba(255, 255, 255, .14) !important; color: #fff !important; border: 1px solid rgba(255, 255, 255, .28) !important;
}
html body:not(.d-none) .d-band.d-band.d-band :is(.fl-chip, .admin-badge, .mm-state, .dash-chip, .pl-state) * { color: #fff !important; }

/* Annonces : en-tête de l'aperçu en bleu nuit (l'orange n'est jamais un fond sous du texte). */
html body.admin-workspace .popup-preview-header { background: var(--d-night) !important; background-image: none !important; color: #fff !important; }

/* ── Code couleur des avis (évaluations et avis clients) ─────────────────────
   Vert = 4 et 5 étoiles, orange = 3 étoiles, rouge = 1 et 2 étoiles. Les étoiles
   sont dorées ; la note est aussi écrite (« 4/5 ») pour ne pas reposer sur la couleur. */
html body.admin-workspace :is(.eval-comment, .rv-card) { --rate: #047857; --rate-bg: #e3f6ee; --rate-ink: #047857; position: relative; overflow: hidden; }
html body.admin-workspace :is(.eval-comment, .rv-card).rate-mid { --rate: #f97316; --rate-bg: #fdf1dc; --rate-ink: #8f4f06; }
html body.admin-workspace :is(.eval-comment, .rv-card).rate-low { --rate: #b42318; --rate-bg: #fdecea; --rate-ink: #b42318; }
html[data-theme="dark"] body.admin-workspace :is(.eval-comment, .rv-card) { --rate-bg: rgba(16, 150, 100, .2); --rate-ink: #6fd3a2; }
html[data-theme="dark"] body.admin-workspace :is(.eval-comment, .rv-card).rate-mid { --rate-bg: rgba(249, 115, 22, .18); --rate-ink: #fdba74; }
html[data-theme="dark"] body.admin-workspace :is(.eval-comment, .rv-card).rate-low { --rate-bg: rgba(220, 38, 38, .2); --rate-ink: #fca5a5; }
html body.admin-workspace :is(.eval-comment, .rv-card)::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--rate); }
/* Étoiles dorées, étoiles vides grises. */
html body.admin-workspace :is(.ev-stars-line, .rv-stars, .admin-review-stars) > span, html body.admin-workspace :is(.ev-stars-line, .rv-stars, .admin-review-stars) { color: #b8860b !important; }
html body.admin-workspace :is(.ev-stars-line, .rv-stars, .admin-review-stars) i { color: #cbd5e1 !important; font-style: normal; }
html[data-theme="dark"] body.admin-workspace :is(.ev-stars-line, .rv-stars, .admin-review-stars) > span, html[data-theme="dark"] body.admin-workspace :is(.ev-stars-line, .rv-stars, .admin-review-stars) { color: #f5c542 !important; }
html[data-theme="dark"] body.admin-workspace :is(.ev-stars-line, .rv-stars, .admin-review-stars) i { color: #3a4f78 !important; }
/* Note écrite dans une pastille de la couleur de l'avis. */
html body.admin-workspace :is(.eval-comment, .rv-card) :is(.rate-pill, .rv-stars b) {
  display: inline-flex; align-items: center; min-height: 22px; margin-left: 8px; padding: 0 8px; border-radius: 999px;
  background: var(--rate-bg) !important; color: var(--rate-ink) !important; font: 700 12px/1 var(--d-text-font) !important; letter-spacing: 0 !important;
}
html body.admin-workspace .ev-stars-line { display: inline-flex; align-items: center; }
/* Pied de carte identique sur tous les avis : avatar et nom alignés, date dessous à droite. */
html body.admin-workspace .ev-voices .eval-comment { display: flex !important; flex-direction: column !important; }
html body.admin-workspace .ev-voices .eval-comment-head { display: grid !important; grid-template-columns: 34px minmax(0, 1fr); align-items: center; column-gap: 10px; row-gap: 6px; margin-top: auto !important; padding-top: 12px; border-top: 1px solid var(--d-line); }
html body.admin-workspace .ev-voices .eval-comment-head .eval-avatar { grid-column: 1; grid-row: 1; }
html body.admin-workspace .ev-voices .eval-comment-head .eval-who { grid-column: 2; grid-row: 1; }
html body.admin-workspace .ev-voices .eval-comment-head time { grid-column: 1 / -1; grid-row: 2; justify-self: end; margin: 0 !important; }

/* ── Messagerie intégrée (administration et espace membre) ─────────────────── */
/* Hauteur ajustée à l'écran par js/lib/chat-fit.js : la saisie reste visible. */
html body .tc[data-fit] { height: var(--chat-h) !important; min-height: 0 !important; max-height: none !important; }
html body .team-chat-page { margin-bottom: 0 !important; }
/* Titre de colonne : un titre de liste, pas un titre de page. */
html body :is(.tc-list-head) :is(h1, h2) { font: 800 18px/1.2 var(--d-title) !important; letter-spacing: -.01em !important; color: var(--d-night) !important; margin: 0 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-transform: none !important; }
html[data-theme="dark"] body :is(.tc-list-head) :is(h1, h2) { color: #fff !important; }
html body .tc-list-head { gap: 10px !important; align-items: center !important; flex-wrap: nowrap !important; }
/* Titre du fil : focalisé par le script pour les lecteurs d'écran, sans anneau visible. */
html body :is(h1, h2, h3)[tabindex="-1"]:focus, html body :is(h1, h2, h3)[tabindex="-1"]:focus-visible { outline: none !important; box-shadow: none !important; }
/* Page « Mes messages » : en-tête court (le texte d'explication est retiré). */
html body.member-workspace .member-page-heading > p { display: none !important; }
html body.member-workspace .member-chat-team { border-radius: 12px !important; }
/* Formateur : bascule Équipe / Support en onglets compacts. */
html body.member-workspace .member-inbox-switch { display: inline-flex !important; gap: 4px !important; padding: 4px !important; margin: 0 0 16px !important; border-radius: 12px !important; background: var(--d-zone) !important; border: 0 !important; box-shadow: none !important; width: auto !important; }
html body.member-workspace .member-inbox-tab { display: inline-flex !important; align-items: center !important; gap: 8px !important; min-height: 40px !important; padding: 0 14px !important; border: 0 !important; border-radius: 9px !important; background: transparent !important; box-shadow: none !important; color: var(--d-text) !important; text-decoration: none !important; }
html body.member-workspace .member-inbox-tab.is-active { background: var(--d-page) !important; color: var(--d-night) !important; box-shadow: 0 1px 2px rgba(16, 28, 50, .08) !important; }
html[data-theme="dark"] body.member-workspace .member-inbox-tab.is-active { background: var(--d-zone-2) !important; color: #fff !important; }
html body.member-workspace .member-inbox-tab::after, html body.member-workspace .member-inbox-tab::before { display: none !important; }
html body.member-workspace .member-inbox-icon { width: auto !important; height: auto !important; background: none !important; border: 0 !important; color: var(--d-blue) !important; }
html body.member-workspace .member-inbox-icon svg { width: 18px !important; height: 18px !important; }
html body.member-workspace .member-inbox-copy small { display: none !important; }
html body.member-workspace .member-inbox-copy strong { font: 700 14px/1 var(--d-text-font) !important; }
html body.member-workspace .member-inbox-count { position: static !important; margin-left: 2px; }
@media (max-width: 799px) { html body.member-workspace .member-inbox-switch { display: flex !important; } html body.member-workspace .member-inbox-tab { flex: 1 1 0; justify-content: center; min-height: 44px !important; } }
/* Espace membre : le titre de colonne répète le titre de page et les onglets ; masqué à l'écran, gardé pour les lecteurs d'écran. */
html body.member-workspace .tc-list-head :is(h1, h2) { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; }
html body.member-workspace .tc-list-head { justify-content: flex-end !important; }
html body.member-workspace .tc-list-head .tc-head-actions { margin-left: 0 !important; }
html body .tc-filters { flex-wrap: wrap !important; overflow: visible !important; row-gap: 6px !important; }

/* Annonces : l'aperçu reprend la fenêtre publique, bouton en aplat bleu. */
html body.admin-workspace .popup-preview-btn { background: #2454ce !important; background-image: none !important; color: #fff !important; }