/* ============================================================================
   MB ACADÉMIE — SOCLE DE L'APPLICATION
   Source unique des couleurs, du texte, des rayons, du focus et des composants
   de base pour l'administration, l'espace membre, l'authentification et les
   pages de présence. Chargée EN DERNIER sur chaque page : elle arbitre les
   feuilles historiques sans les réécrire.

   Charte graphique MB Académie (édition octobre 2026) :
   bleu principal #2454CE pour l'action, bleu nuit #101C32 pour les titres,
   orange #F97316 en repère seulement, bleu clair #BFDBFE sur fond sombre,
   texte courant #334155, fond général #F7F8FA, boutons à coins de 10 px,
   Helvetica / Arial pour les textes, la navigation et les boutons.
   Les points où la charte est muette (couleurs d'état, échelle de texte,
   focus, thème sombre) sont décrits dans audit/charte-extension.md.
   ========================================================================== */

/* ── 1. Tokens ─────────────────────────────────────────────────────────────── */
:root {
  /* Charte */
  --mb-blue: #2454ce;
  --mb-blue-hover: #1c43a8;
  --mb-blue-soft: #e9effc;
  --mb-night: #101c32;
  --mb-orange: #f97316;
  --mb-sky: #bfdbfe;
  --mb-text: #334155;
  --mb-bg: #f7f8fa;
  /* Extension : neutres de la même gamme bleutée */
  --mb-muted: #556378;            /* 6,0:1 sur blanc */
  --mb-surface: #ffffff;
  --mb-surface-2: #eef2f8;
  --mb-line: #e2e8f0;
  --mb-line-strong: #cbd5e1;
  /* Extension : une couleur = une signification */
  --mb-info: var(--mb-blue);
  --mb-info-bg: var(--mb-blue-soft);
  --mb-success: #047857;          /* 5,5:1 sur blanc */
  --mb-success-bg: #e3f6ee;
  --mb-warning: #8f4f06;          /* 6,3:1 sur blanc */
  --mb-warning-bg: #fdf1dc;
  --mb-danger: #b42318;           /* 6,6:1 sur blanc */
  --mb-danger-bg: #fdecea;
  --mb-on-solid: #ffffff;
  --mb-disabled-opacity: .5;
  /* Formes */
  --mb-radius: 10px;              /* boutons, champs (charte) */
  --mb-radius-card: 14px;
  --mb-angle: 14px 70px 14px 14px;/* angle signature, rapport 1:5 */
  /* Texte */
  --mb-font-text: Helvetica, Arial, sans-serif;
  --mb-font-title: 'Montserrat Brand', Montserrat, Helvetica, Arial, sans-serif;
  --mb-text-xs: 12px;             /* plancher de lisibilité */
  --mb-text-sm: 13px;
  --mb-text-md: 14px;
  --mb-text-lg: 16px;
  /* Contrôles */
  --mb-control-sm: 32px;
  --mb-control: 40px;
  --mb-control-lg: 48px;
  --mb-touch: 44px;
  /* Focus */
  --mb-focus: var(--mb-blue);
  --mb-focus-halo: #ffffff;
}
[data-theme="dark"] {
  --mb-text: #d5deea;
  --mb-muted: #a3b1c6;
  --mb-bg: #0b1426;
  --mb-surface: #101c32;
  --mb-surface-2: #17274a;
  --mb-line: #22345a;
  --mb-line-strong: #2f4473;
  --mb-info: var(--mb-sky);
  --mb-info-bg: rgba(80, 125, 245, .18);
  --mb-success: #6fd3a2;
  --mb-success-bg: rgba(16, 150, 100, .18);
  --mb-warning: #f5c56b;
  --mb-warning-bg: rgba(245, 158, 11, .16);
  --mb-danger: #fca5a5;
  --mb-danger-bg: rgba(220, 38, 38, .18);
  --mb-focus: var(--mb-sky);
  --mb-focus-halo: #101c32;
}

/* ── 2. Raccord des anciens systèmes de tokens ─────────────────────────────── */
html:not([data-theme="dark"]) body.admin-workspace {
  --x-ink-2: var(--mb-text); --admin-text-secondary: var(--mb-text);
  --x-muted: var(--mb-muted); --admin-text-muted: var(--mb-muted);
  --x-line: var(--mb-line); --x-line-strong: var(--mb-line-strong); --admin-border: var(--mb-line);
}
body.admin-workspace {
  --admin-success: var(--mb-success); --admin-warning: var(--mb-warning); --admin-danger: var(--mb-danger);
  --x-good: var(--mb-success); --x-warn: var(--mb-warning); --x-crit: var(--mb-danger);
  --admin-accent: var(--mb-blue);
}
html:not([data-theme="dark"]) body.member-workspace {
  --bg-primary: var(--mb-bg);
  --text: var(--mb-night); --text-secondary: var(--mb-text); --text-muted: var(--mb-muted);
  --border: var(--mb-line);
  --primary-hover: var(--mb-blue-hover);
  --success: var(--mb-success); --warning: var(--mb-warning); --danger: var(--mb-danger);
  color: var(--mb-text);
}
body.member-workspace { --member-accent: var(--mb-focus); }
html:not([data-theme="dark"]) :is(.team-chat-page, .tc-modal, #composeModal) {
  --tc-text: var(--mb-text); --tc-muted: var(--mb-muted); --tc-faint: var(--mb-muted);
  --tc-line: var(--mb-line); --tc-line-strong: var(--mb-line-strong); --tc-bg: var(--mb-bg);
  --tc-green: var(--mb-success);
}
:is(.team-chat-page, .tc-modal, #composeModal) { --tc-blue-2: var(--mb-blue); }
[data-theme="dark"] :is(.team-chat-page, .tc-modal, #composeModal) { --tc-faint: var(--mb-muted); --tc-green: var(--mb-success); }
:root { --fl-green: var(--mb-success); --fl-red: var(--mb-danger); --fl-orange-dark: var(--mb-warning); }
.qd { --qd-accent: var(--mb-blue); --qd-ink: var(--mb-night); }
.signature-pad:focus-within, .signature-pad:hover { border-color: var(--mb-blue); }

/* Pages de présence : même palette et mêmes polices que le reste. */
body.presence {
  --p-ink: var(--mb-night); --p-muted: var(--mb-muted); --p-bg: var(--mb-bg); --p-line: var(--mb-line);
  --p-accent: var(--mb-blue); --p-accent-soft: var(--mb-blue-soft);
  --p-ok: var(--mb-success); --p-ok-soft: var(--mb-success-bg); --p-warn: var(--mb-warning); --p-warn-soft: var(--mb-warning-bg);
  font-family: var(--mb-font-text); color: var(--mb-text);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) body.presence {
    --p-ink: #e8edf6; --p-muted: #a3aec0; --p-bg: #0b1426; --p-line: #22345a;
    --p-accent: #7aa2ff; --p-accent-soft: #1d2d52; --p-ok: #6fd3a2; --p-ok-soft: #15362a; --p-warn: #f5c56b; --p-warn-soft: #3a2a14;
    color: #d5deea;
  }
}
body.presence :is(h1, h2, h3, .presence-top span) { font-family: var(--mb-font-title); }
body.presence .presence-top { background: var(--mb-night); }
body.presence .presence-top span { color: #fff; }

/* Pictogrammes des pages de présence : au trait, en bleu principal. */
body.presence .p-notice .p-emoji { display: grid; place-items: center; width: 64px; height: 64px; margin: 0 auto; border-radius: 50%; background: var(--p-accent-soft); color: var(--p-accent); font-size: 30px; }
body.presence :is(.pl-note, .pl-place, .pl-paste summary) svg { vertical-align: -3px; margin-right: 4px; font-size: 18px; }
body.presence .pl-remove { min-width: var(--mb-touch); min-height: var(--mb-touch); }

/* ── 3. Focus : un seul anneau, partout ────────────────────────────────────── */
html body :is(a, button, input, select, textarea, summary, [tabindex], [role="button"], [role="tab"], [contenteditable="true"]):focus-visible {
  outline: 2px solid var(--mb-focus) !important;
  outline-offset: 2px !important;
}
/* Sur les aplats sombres ou bleus, l'anneau passe en bleu clair (12:1 sur bleu nuit). */
html body :is(.admin-btn-primary, .member-btn:not(.member-btn-secondary):not(.member-btn-danger), .fl-main, .tc-new, .auth-submit, .p-btn:not(.p-btn-ghost), .btn-primary, .x-create > button, .presence-top a, .mh-hero :is(a, button), .today-hero :is(a, button), .mm-hero :is(a, button)):focus-visible {
  outline-color: var(--mb-focus) !important;
  box-shadow: 0 0 0 2px var(--mb-focus-halo) !important;
  outline-offset: 4px !important;
}

/* ── 4. Bouton : une forme, trois tailles ──────────────────────────────────── */
html body :is(.admin-btn, .member-btn, .training-btn, .fl-main, .fl-secondary, .tc-new, .tc-secondary, .auth-submit, .auth-oauth, .p-btn, .btn, .application-submit-button, .mm-now-cta, .pl-cta, .apt-confirm-btn, .admin-pagination-btn, .fc .fc-button) {
  font-family: var(--mb-font-text) !important;
  font-weight: 700 !important;
  border-radius: var(--mb-radius) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
html body :is(.admin-btn, .member-btn, .training-btn, .tc-new, .tc-secondary) { min-height: var(--mb-control) !important; font-size: var(--mb-text-sm) !important; }
html body :is(.admin-btn-sm, .member-btn-sm) { min-height: var(--mb-control-sm) !important; font-size: var(--mb-text-sm) !important; }
html body :is(.fl-main, .fl-secondary, .auth-submit, .auth-oauth, .p-btn, .btn-lg, .application-submit-button, .mm-now-cta) { min-height: var(--mb-control-lg) !important; }
/* Boutons-icônes et boutons d'en-tête : même rayon que les autres. */
html body :is(.admin-header-btn, .admin-btn-icon, .admin-theme-toggle, .admin-menu-toggle, .admin-logout-btn, .admin-modal-close, .users-action, .apt-icon-btn, .member-theme-toggle, .member-logout-btn, .member-nav-toggle, .tc-icon, .tc-tool, .tc-send, .dash-go, .quote-close, .pl-remove) { border-radius: var(--mb-radius) !important; }

/* Action principale : aplat bleu, sans dégradé. */
html body :is(.admin-btn-primary, .member-btn:not(.member-btn-secondary):not(.member-btn-danger):not(.member-btn-ghost), .member-btn-primary, .training-btn:not(.training-btn-muted):not(.training-btn-danger), .fl-main, .tc-new, .tc-send, .auth-submit, .p-btn:not(.p-btn-ghost), .btn-primary, .application-submit-button, .mm-now-cta) {
  background: var(--mb-blue) !important;
  background-image: none !important;
  border-color: var(--mb-blue) !important;
  color: var(--mb-on-solid) !important;
}
html body :is(.admin-btn-primary, .member-btn:not(.member-btn-secondary):not(.member-btn-danger):not(.member-btn-ghost), .member-btn-primary, .training-btn:not(.training-btn-muted):not(.training-btn-danger), .fl-main, .tc-new, .tc-send, .auth-submit, .p-btn:not(.p-btn-ghost), .btn-primary, .application-submit-button, .mm-now-cta):hover:not(:disabled):not([aria-disabled="true"]) {
  background: var(--mb-blue-hover) !important;
  border-color: var(--mb-blue-hover) !important;
}
/* Action destructive : même rouge partout. */
html body :is(.admin-btn-danger, .member-btn-danger, .training-btn-danger) { color: var(--mb-danger) !important; background: var(--mb-danger-bg) !important; border-color: transparent !important; }
html body .admin-confirm-dialog .admin-btn-danger, html body .mb-btn-danger-solid { background: #b42318 !important; color: #fff !important; }
/* Désactivé et en cours : même rendu pour toutes les familles. */
html body :is(.admin-btn, .member-btn, .training-btn, .fl-main, .fl-secondary, .tc-new, .tc-secondary, .tc-send, .auth-submit, .p-btn, .btn, .application-submit-button):is(:disabled, [aria-disabled="true"]) {
  opacity: var(--mb-disabled-opacity) !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
}
html body :is(.admin-btn, .member-btn, .training-btn, .fl-main, .p-btn, .btn)[aria-busy="true"] { cursor: progress !important; opacity: .75 !important; }

/* ── 5. Champ : une forme, un état d'erreur ────────────────────────────────── */
html body :is(.admin-form-input, .admin-form-select, .admin-form-textarea, .admin-select, .admin-search, .admin-date-input, .member-form-input, .auth-field input, .auth-select, .auth-textarea, .p-field input, .p-field textarea, .fl-field input, .fl-field textarea, .fl-field select, .tc-field input, .tc-field textarea, .application-field input, .application-field textarea, .application-field select, .crm-form input, .crm-form select, .crm-form textarea, .mail-field input, .mail-field textarea) {
  font-family: var(--mb-font-text) !important;
  font-weight: 400 !important;
  border-radius: var(--mb-radius) !important;
}
html body :is(.admin-form-label, .member-form-label, .auth-field label, .fl-field, .p-field label, .application-field label) { font-family: var(--mb-font-text) !important; }
/* État d'erreur commun : aria-invalid posé par le script, ou classe .is-invalid. */
html body :is(input, select, textarea):is([aria-invalid="true"], .is-invalid) {
  border-color: var(--mb-danger) !important;
  box-shadow: 0 0 0 3px var(--mb-danger-bg) !important;
}
html body .mb-field-error { display: block; margin-top: 6px; color: var(--mb-danger); font: 400 var(--mb-text-sm)/1.4 var(--mb-font-text); }
html body .mb-field-error::before { content: "! "; font-weight: 700; }
html body .member-required { color: var(--mb-danger) !important; }

/* ── 5 bis. Fenêtre de confirmation commune (js/lib/confirm.js) ─────────────── */
.mb-dialog-overlay { position: fixed; inset: 0; z-index: 2000; display: grid; place-items: center; padding: 16px; background: rgba(16, 28, 50, .55); }
.mb-dialog { width: min(440px, 100%); max-height: calc(100dvh - 32px); overflow: auto; padding: 24px; border-radius: var(--mb-radius-card); background: var(--mb-surface); color: var(--mb-text); border: 1px solid var(--mb-line); box-shadow: 0 30px 80px -30px rgba(16, 28, 50, .6); font: 400 var(--mb-text-md)/1.55 var(--mb-font-text); }
html body .mb-dialog-title { margin: 0 0 8px; font: 700 18px/1.3 var(--mb-font-title) !important; color: var(--mb-night); text-transform: none !important; letter-spacing: 0 !important; }
[data-theme="dark"] body .mb-dialog-title { color: #fff; }
.mb-dialog-body { margin: 0 0 4px; }
.mb-dialog-field { display: block; margin: 16px 0 6px; font-weight: 700; font-size: var(--mb-text-sm); }
.mb-dialog-field small { font-weight: 400; color: var(--mb-muted); }
.mb-dialog textarea { display: block; width: 100%; min-height: 84px; padding: 10px 12px; border: 1px solid var(--mb-line-strong); border-radius: var(--mb-radius); background: var(--mb-surface); color: inherit; font: 400 16px/1.5 var(--mb-font-text); resize: vertical; }
.mb-dialog-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-top: 22px; }
.mb-dialog-btn { min-height: var(--mb-touch); padding: 0 18px; border: 1px solid var(--mb-line-strong); border-radius: var(--mb-radius); background: var(--mb-surface); color: var(--mb-night); font: 700 var(--mb-text-md)/1 var(--mb-font-text); cursor: pointer; }
[data-theme="dark"] .mb-dialog-btn { color: #fff; }
.mb-dialog-btn:hover { background: var(--mb-surface-2); }
.mb-dialog-btn.is-primary { border-color: var(--mb-blue); background: var(--mb-blue); color: #fff; }
.mb-dialog-btn.is-primary:hover { border-color: var(--mb-blue-hover); background: var(--mb-blue-hover); }
.mb-dialog-btn.is-danger { border-color: #b42318; background: #b42318; color: #fff; }
.mb-dialog-btn.is-danger:hover { background: #912018; }
@media (max-width: 480px) { .mb-dialog-actions { flex-direction: column-reverse; } .mb-dialog-btn { width: 100%; } }

/* État d'erreur de chargement : dit ce qui se passe et propose de réessayer. */
.mb-state-error { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border: 1px solid var(--mb-line); border-left: 4px solid var(--mb-danger); border-radius: var(--mb-radius); background: var(--mb-surface); color: var(--mb-text); }
.mb-state-error p { margin: 0; }

/* ── 6. États : une couleur = une signification ────────────────────────────── */
/* Compteurs sur pastille pleine : blanc sur rouge sombre, 6,6:1, en clair comme en sombre. */
html body :is(.admin-header-count-badge, .member-nav-badge, .admin-nav-badge.is-alert, .x-tab-badge) {
  background: #b42318 !important; color: #fff !important; font-weight: 700 !important;
}
html body #unreadFilterCount { background: var(--mb-night) !important; color: #fff !important; }
html[data-theme="dark"] body #unreadFilterCount { background: var(--mb-sky) !important; color: var(--mb-night) !important; }
/* Messagerie : heure et présence lisibles. */
html body :is(.team-chat-page, .tc) .tc-msg:not(.is-mine) time { color: var(--mb-muted) !important; }
html body :is(.team-chat-page, .tc) .tc-msg.is-mine time { color: rgba(255, 255, 255, .88) !important; }
html body :is(.team-chat-page, .tc) .is-on { color: var(--mb-success) !important; }
/* Étoiles vides : au moins 3:1 pour un élément d'interface. */
html:not([data-theme="dark"]) body.presence .p-stars label:not(.is-on) { color: #7c8ba1; }
/* Étoiles choisies : toujours dorées, quelle que soit la règle des étoiles vides. */
html body.presence .p-stars-row.has-value label.is-on { color: var(--p-star, #f5a524); }
html:not([data-theme="dark"]) body :is(.eval-stars i, .attendance-stars) { color: #b45309; }
/* Liens sur fond sombre : bleu clair de la charte, jamais le bleu principal. */
html[data-theme="dark"] body :is(.tc-text a, .fl-link, .member-content a:not([class*="btn"]):not(.member-nav-link), .admin-content a:not([class*="btn"]):not([class*="nav"])) { color: var(--mb-sky) !important; }

/* ── 7. Plancher de lisibilité : aucun texte sous 12 px ────────────────────── */
html body :is(.admin-user-role, .admin-header-profile-role, .admin-search-kbd, .admin-header-count-badge, .member-nav-badge, .member-eyebrow, .member-role-chip, .member-tab-count, .training-kicker, .admin-sidebar-brand small, .admin-brand small, .x-tab-badge, .admin-nav-badge, .fl-chip, .admin-badge, .tc time, .team-chat-page time, .auth-legal) { font-size: var(--mb-text-xs) !important; }
html body:is(.admin-workspace, .member-workspace, .ui-polish) :is(small, kbd, figcaption, dt, summary) { font-size: max(var(--mb-text-xs), .85em) !important; }
html body :is(.admin-pagination-btn, .tc-avatar, .tc-badge, .session-row-date, .req-origin, .workspace-outbox-health, #unreadFilterCount, .fc-col-header-cell-cushion, .ck-doc-icon, .admin-pagination-info, #logsPaginationInfo) { font-size: var(--mb-text-xs) !important; }
html body :is(.admin-header-count-badge, .member-nav-badge) { min-width: 20px !important; min-height: 20px !important; line-height: 20px !important; padding: 0 5px !important; }

/* ── 8. Titres de l'application : Montserrat en phrase ─────────────────────── */
/* La feuille du site public impose Couture en capitales ; la charte la réserve
   aux titres courts de communication. */
html body:is(.member-workspace, .admin-workspace) :is(h1, h2, h3, h4) {
  font-family: var(--mb-font-title) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

/* ── 8 bis. Bandeaux de l'espace membre : une ligne, alignée sur le contenu ─── */
html body.member-workspace .member-message-notice { max-width: 1104px; margin: 12px auto 0; padding: 6px 6px 6px 16px; gap: 12px; flex-wrap: nowrap; border: 1px solid var(--mb-line); border-left: 4px solid var(--mb-blue); border-radius: var(--mb-radius); background: var(--mb-surface); color: var(--mb-text); font-size: var(--mb-text-md); }
html body.member-workspace .member-message-notice > span { flex: 1 1 auto; min-width: 0; }
html body.member-workspace .member-message-notice strong { color: var(--mb-night); }
[data-theme="dark"] body.member-workspace .member-message-notice strong { color: #fff; }
html body.member-workspace .member-notice-detail { color: var(--mb-muted); }
html body.member-workspace .member-notice-detail::before { content: "· "; }
html body.member-workspace .member-message-notice > button { min-width: var(--mb-touch); min-height: var(--mb-touch); font-size: 20px; border-radius: var(--mb-radius); }
@media (max-width: 1136px) { html body.member-workspace .member-message-notice { margin-inline: 16px; } }
@media (max-width: 560px) { html body.member-workspace .member-message-notice { flex-wrap: wrap; padding: 10px 12px; } html body.member-workspace .member-notice-detail { display: block; } html body.member-workspace .member-notice-detail::before { content: ""; } }

/* ── 8 ter. Mes formations (espace client) ─────────────────────────────────── */
.mf-section { margin: 28px 0 12px; font: 700 18px/1.3 var(--mb-font-title); color: var(--mb-night); }
[data-theme="dark"] .mf-section, [data-theme="dark"] .mf-title h3 { color: #fff; }
.mf-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.mf-item { padding: 18px 20px; border: 1px solid var(--mb-line); border-radius: var(--mb-radius-card); background: var(--mb-surface); }
.mf-head { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; }
.mf-title h3 { margin: 0; font: 700 17px/1.3 var(--mb-font-title); color: var(--mb-night); }
.mf-title p { margin: 2px 0 0; color: var(--mb-muted); font-size: var(--mb-text-md); }
.mf-days { list-style: none; margin: 14px 0 0; padding: 12px 0 0; border-top: 1px solid var(--mb-line); display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px 24px; }
.mf-days li { display: flex; justify-content: space-between; gap: 12px; font-size: var(--mb-text-md); }
.mf-days strong { font-weight: 700; color: var(--mb-text); }
.mf-days span { color: var(--mb-muted); white-space: nowrap; }
.mf-pending { margin: 12px 0 0; padding: 10px 12px; border-radius: var(--mb-radius); background: var(--mb-warning-bg); font-size: var(--mb-text-md); }
.mf-pending a { color: var(--mb-warning); font-weight: 700; }
.mf-empty { padding: 40px 24px; text-align: center; border: 1px solid var(--mb-line); border-radius: var(--mb-radius-card); background: var(--mb-surface); }
.mf-empty h2 { margin: 0 0 8px; font-size: 20px; }
.mf-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 20px 0 0; }
.mf-trainer { margin: 32px 0 0; padding-top: 16px; border-top: 1px solid var(--mb-line); color: var(--mb-muted); font-size: var(--mb-text-md); }
.mf-trainer a { color: var(--mb-blue); font-weight: 700; }
[data-theme="dark"] .mf-trainer a { color: var(--mb-sky); }
.mm-state.is-done { background: var(--mb-surface-2); color: var(--mb-muted); }
@media (max-width: 560px) { .mf-head { grid-template-columns: auto 1fr; } .mf-head .mm-state { grid-column: 1 / -1; justify-self: start; } .mf-days li { flex-direction: column; gap: 0; } }

/* Fiche mission : outils secondaires repliés. */
html body .mm-tools-more { margin-top: 12px; }
html body .mm-tools-more > summary { display: inline-flex; align-items: center; min-height: var(--mb-touch); padding: 0 4px; color: var(--mb-blue); font: 700 var(--mb-text-md)/1 var(--mb-font-text); cursor: pointer; }
[data-theme="dark"] body .mm-tools-more > summary { color: var(--mb-sky); }
html body .mm-tools-more[open] > summary { margin-bottom: 8px; }
html body .mm-tools-main { margin-top: 12px; }
/* Titre de la messagerie d’équipe : même taille que les autres pages. */
html body.member-workspace .team-chat-page h1 { font-size: clamp(26px, 3vw, 34px) !important; }

/* Message d’information dans la page (accès hors rôle, etc.). */
.mb-notice { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 16px; padding: 10px 8px 10px 16px; border: 1px solid var(--mb-line); border-left: 4px solid var(--mb-blue); border-radius: var(--mb-radius); background: var(--mb-info-bg); color: var(--mb-text); font: 400 var(--mb-text-md)/1.5 var(--mb-font-text); }
.mb-notice p { margin: 0; }
.mb-notice button { min-width: var(--mb-touch); min-height: var(--mb-touch); border: 0; border-radius: var(--mb-radius); background: transparent; color: inherit; font-size: 20px; cursor: pointer; }
/* Titre de page et aide côte à côte. */
html body .workspace-title-row { display: flex; align-items: center; gap: 10px; }
html body .workspace-title-row h1 { margin: 0; }
html body .dossier-head-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }

/* Accueil de l’équipe : sujet à plusieurs éléments, dépliable. */
html body .dash-todo-group > summary { list-style: none; cursor: pointer; width: 100%; }
html body .dash-todo-group > summary::-webkit-details-marker { display: none; }
html body .dash-todo-group[open] .dash-todo-fold { transform: rotate(180deg); }
html body .dash-todo-items { list-style: none; margin: 0 0 8px 62px; padding: 0; border-left: 2px solid var(--mb-line); }
html body .dash-todo-items li { display: flex; align-items: center; gap: 10px; padding: 0 0 0 14px; min-height: var(--mb-touch); }
html body .dash-todo-items li > a:first-child { flex: 1 1 auto; min-width: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; padding: 8px 0; color: var(--mb-text); text-decoration: none; }
html body .dash-todo-items li > a:first-child:hover strong { color: var(--mb-blue); text-decoration: underline; }
[data-theme="dark"] body .dash-todo-items li > a:first-child:hover strong { color: var(--mb-sky); }
html body .dash-todo-items strong { font-weight: 700; font-size: var(--mb-text-md); }
html body .dash-todo-items small { color: var(--mb-muted); font-size: var(--mb-text-sm); }
html body .dash-todo-all a { color: var(--mb-blue) !important; font-weight: 700; font-size: var(--mb-text-sm); }
[data-theme="dark"] body .dash-todo-all a { color: var(--mb-sky) !important; }
@media (max-width: 640px) { html body .dash-todo-items { margin-left: 16px; } html body .dash-todo-items li { flex-wrap: wrap; padding-bottom: 6px; } }

/* Confirmation de l’adresse email : même gabarit que les autres pages d’authentification. */
.ui-polish .confirm-address { color: var(--mb-night); overflow-wrap: anywhere; }
.ui-polish .confirm-steps { margin: 20px 0; padding: 16px 16px 16px 36px; border: 1px solid var(--mb-line); border-radius: var(--mb-radius); background: var(--mb-bg); color: var(--mb-text); font-size: var(--mb-text-lg); line-height: 1.5; }
.ui-polish .confirm-steps li + li { margin-top: 8px; }
.ui-polish .confirm-steps, .ui-polish .confirm-steps li { list-style: decimal; }
/* Logotype : Montserrat SemiBold, capitales accentuées, approche +4 % (charte). */
.ui-polish .auth-logo span { font-family: var(--mb-font-title) !important; font-weight: 600 !important; letter-spacing: .04em !important; text-transform: uppercase; }
.ui-polish .confirm-open { display: flex; align-items: center; justify-content: center; text-decoration: none; }
.ui-polish .confirm-open[hidden] { display: none; }
.ui-polish .confirm-help { margin: 16px 0 0; color: var(--mb-muted); font-size: var(--mb-text-md); line-height: 1.5; }
.ui-polish .confirm-help a { color: var(--mb-blue); font-weight: 700; }
[data-theme="dark"] .ui-polish .confirm-address { color: #fff; }
[data-theme="dark"] .ui-polish .confirm-help a { color: var(--mb-sky); }

/* ── 9. Téléphone et tablette : cibles tactiles de 44 px ───────────────────── */
@media (max-width: 800px) {
  html body :is(.admin-btn, .member-btn, .training-btn, .tc-new, .tc-secondary, .admin-btn-sm, .member-btn-sm, .admin-pagination-btn, .admin-period-btn, .crm-view-btn, .member-tab, .x-switch button, .admin-tab, .workspace-tab) { min-height: var(--mb-touch) !important; }
  html body :is(.admin-header-btn, .admin-btn-icon, .admin-theme-toggle, .admin-menu-toggle, .admin-logout-btn, .admin-modal-close, .users-action, .apt-icon-btn, .member-theme-toggle, .member-logout-btn, .tc-icon, .tc-tool, .dash-go, .quote-close, .quote-remove, .pl-remove, .signature-clear) {
    min-width: var(--mb-touch) !important; min-height: var(--mb-touch) !important;
  }
  html body :is(.admin-form-input, .admin-form-select, .admin-select, .admin-search, .admin-date-input, .member-form-input) { min-height: var(--mb-touch) !important; font-size: 16px !important; }
  html body :is(.x-create > button, .admin-header-profile-btn, .invoice-filter, .dossier-back, .dossier-chip, .today-quick-btn, .tc-back, .tc-send, .crm-view-btn, .fc .fc-button, .admin-filter-toggle, .popup-preview-btn, .mb-cc-btn, .fl-link, .user-name, .user-email, .user-phone, .member-navbar-brand) { min-height: var(--mb-touch) !important; }
  html body :is(.x-create > button, .admin-header-profile-btn, .tc-back, .tc-send, .crm-view-btn) { min-width: var(--mb-touch) !important; }
  html body :is(.dossier-back, .dossier-chip, .user-name, .user-email, .user-phone, .member-navbar-brand, .fl-link) { display: inline-flex !important; align-items: center !important; }
  html body :is(#replyBody, #conversationSearch, #trainingSearch, .tc-field input, .tc-search input) { min-height: var(--mb-touch) !important; font-size: 16px !important; }
  html body :is(.admin-breadcrumb-link, .member-back-link, .admin-link) { display: inline-flex; align-items: center; min-height: var(--mb-touch); }
}

/* ── 9 bis. Tableaux en lignes empilées sous 640 px (libellés posés par workspace.js) ─ */
@media (max-width: 640px) {
  html body.admin-workspace :is(.admin-table, .participant-table table) { min-width: 0 !important; width: 100% !important; display: block; }
  html body.admin-workspace :is(.admin-table, .participant-table table) thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  html body.admin-workspace :is(.admin-table, .participant-table table) tbody { display: grid; gap: 10px; }
  html body.admin-workspace :is(.admin-table, .participant-table table) tbody tr { display: block; padding: 10px 14px; border: 1px solid var(--mb-line); border-radius: var(--mb-radius); background: var(--mb-surface); }
  html body.admin-workspace :is(.admin-table, .participant-table table) tbody td { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 6px 0 !important; border: 0 !important; text-align: right; min-height: 0; white-space: normal !important; overflow-wrap: anywhere; }
  html body.admin-workspace :is(.admin-table, .participant-table table) tbody td[data-label]::before { content: attr(data-label); flex: 0 0 38%; text-align: left; color: var(--mb-muted); font-weight: 700; font-size: var(--mb-text-sm); }
  html body.admin-workspace :is(.admin-table, .participant-table table) tbody td[colspan] { display: block; text-align: left; }
  html body.admin-workspace :is(.admin-table, .participant-table table) tbody td:empty { display: none; }
  html body.admin-workspace :is(.admin-table, .participant-table table)-wrapper { overflow-x: visible; }
}

/* ── 10. Mouvement réduit ──────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  html body *, html body *::before, html body *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* Bascules de pages sœurs (Clients / Équipe, Sessions / Émargement, Archives) : cible tactile. */
@media (max-width: 800px) { html body .x-switch :is(a, button) { min-height: var(--mb-touch) !important; display: inline-flex !important; align-items: center !important; } }