:root {
  --turquoise: #50DDC4;
  --turquoise-dark: #26BCA1;
  --marine: #233048;
  --violet-500: #815EE5;
  --violet-100: #F8F6FE;
  /* Assombri de #5b6b82 (audit webmaster 30/08/2026) : sur le fond "aurora"
     (dégradés turquoise/violet translucides) derrière les cartes en verre
     dépoli, l'ancienne valeur tombait à 4.2:1 sur la zone violette la plus
     saturée — sous le seuil WCAG AA de 4.5:1 pour du texte normal. Cette
     valeur reste ≥5.3:1 sur toutes les zones du dégradé, tout en gardant la
     même teinte (vérifié par calcul, pas à l'oeil). */
  --slate: #4d5b6f;
  --border: #e8ecf2;
  --bg: #F5F7FA;
  --danger: #e0455a;
  --danger-bg: #FDF0F1;
  /* Même ton que --amber/--amber-tint de partenaires-logement.css (cohérence
     inter-modules) : réservé aux montants dus/en attente, jamais utilisé
     comme couleur de statut générique. */
  --amber: #b8860b;
  --amber-bg: #FDF3E0;
  --shadow-sm: 0 1px 2px rgba(35,48,72,0.04), 0 1px 1px rgba(35,48,72,0.03);
  --shadow-md: 0 8px 24px rgba(35,48,72,0.06), 0 2px 6px rgba(35,48,72,0.04);
  --shadow-lg: 0 24px 48px rgba(35,48,72,0.14);
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
  font-family: 'Poppins', -apple-system, 'Segoe UI', sans-serif;
  color: var(--marine); -webkit-font-smoothing: antialiased;
  position: relative;
  /* Fond d'outil de travail (refonte "CRM pro" du 24/09/2026) : neutre et
     calme, comme les CRM du marché (HubSpot, Pipedrive, Attio) — remplace le
     fond "aurora" coloré et les mascottes décoratives, qui détournaient
     l'attention des données. Un léger voile turquoise en haut garde la
     signature Colybry sans concurrencer les cartes. La mascotte reste
     réservée aux états vides et aux confirmations. */
  background-color: #F4F6FA;
  background-image: linear-gradient(180deg, rgba(80,221,196,0.10) 0%, rgba(244,246,250,0) 320px);
  background-repeat: no-repeat;
}
.cb-admin-topbar, .cb-admin-main, .cb-admin-login-body { position: relative; z-index: 1; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
input, textarea, select, button { font-family: inherit; font-size: 0.95rem; }

/* Login */
.cb-admin-login-body {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: radial-gradient(120% 120% at 15% 10%, #2c3a58 0%, var(--marine) 55%, #182233 100%);
  padding: 20px;
}
.cb-admin-login-wrap { position: relative; width: 100%; max-width: 360px; }
.cb-admin-login-mascot {
  position: absolute; bottom: calc(100% - 18px); right: -14px; width: 128px; height: auto;
  filter: drop-shadow(0 12px 20px rgba(0,0,0,0.35)); pointer-events: none; z-index: 1;
}
.cb-admin-login-box {
  background: #fff; border-radius: 24px; padding: 44px 40px; width: 100%;
  display: flex; flex-direction: column; gap: 14px; box-shadow: var(--shadow-lg); position: relative; z-index: 2;
}
.cb-admin-login-logo { height: 26px; width: auto; margin: 0 auto 10px; }
.cb-admin-login-box h1 { font-size: 1.2rem; font-weight: 800; text-align: center; margin-bottom: 8px; }
.cb-admin-login-box label { font-size: 0.8rem; font-weight: 600; color: var(--slate); }
.cb-admin-login-box input {
  padding: 12px 14px; border: 1.5px solid var(--border); border-radius: 12px; transition: border-color 0.15s;
}
.cb-admin-login-box input:focus { outline: none; border-color: var(--turquoise-dark); }
.cb-admin-login-box button {
  margin-top: 8px; background: var(--turquoise); color: var(--marine); font-weight: 700;
  padding: 13px; border: none; border-radius: 12px; cursor: pointer; transition: background 0.15s, transform 0.1s;
}
.cb-admin-login-box button:hover { background: var(--turquoise-dark); }
.cb-admin-login-box button:active { transform: scale(0.98); }
.cb-admin-error { color: var(--danger); font-size: 0.85rem; }

/* Shell */
.cb-admin-topbar {
  background: rgba(255,255,255,0.55); backdrop-filter: blur(18px) saturate(160%); -webkit-backdrop-filter: blur(18px) saturate(160%);
  border-bottom: 1px solid rgba(35,48,72,0.06); padding: 14px 32px; display: flex; align-items: center;
  justify-content: space-between; position: sticky; top: 0; z-index: 100;
}
.cb-admin-topbar-left { display: flex; align-items: center; gap: 18px; min-width: 0; }
.cb-admin-topbar-mascot { height: 30px; width: auto; }
.cb-admin-logo { height: 32px; margin-right: 4px; }
.cb-admin-nav {
  display: flex; align-items: center; gap: 6px;
  background: rgba(35,48,72,0.04);
  border: 1px solid rgba(35,48,72,0.05);
  border-radius: 999px; padding: 6px;
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; min-width: 0;
}
.cb-admin-nav::-webkit-scrollbar { display: none; }
.cb-admin-nav a {
  position: relative; overflow: hidden; white-space: nowrap; flex-shrink: 0;
  font-size: 0.86rem; font-weight: 600; color: var(--slate);
  padding: 10px 20px; border-radius: 999px;
  transition: color 0.2s ease, background 0.2s ease, box-shadow 0.25s ease, transform 0.15s ease;
}
.cb-admin-nav-has-dropdown::after {
  content: ''; display: inline-block; width: 6px; height: 6px; margin-left: 6px; margin-bottom: 1px;
  border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg); opacity: 0.55; vertical-align: middle;
}
.cb-admin-nav-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 17px; height: 17px; padding: 0 5px; margin-left: 5px;
  background: var(--danger); color: #fff; font-size: 0.66rem; font-weight: 700;
  border-radius: 999px; vertical-align: middle;
}
@media (max-width: 900px) {
  .cb-admin-topbar { padding: 14px 16px; gap: 10px; }
  .cb-admin-nav { max-width: 100%; }
}
.cb-admin-nav a::before {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: linear-gradient(135deg, rgba(255,255,255,0.75) 0%, rgba(255,255,255,0) 55%);
  opacity: 0; transition: opacity 0.25s ease;
}
.cb-admin-nav a:hover { color: var(--marine); transform: translateY(-1px); }
.cb-admin-nav a.active {
  color: var(--marine); background: #fff;
  box-shadow: 0 10px 22px rgba(35,48,72,0.14), 0 2px 6px rgba(35,48,72,0.08), inset 0 1px 0 rgba(255,255,255,0.6);
}
/* Onglet "Boutique" (Produits/Commandes/Codes promo) : même carte flottante
   que le dropdown du site public (.cb-nav-dropdown-* dans colybry.css), mais
   en position:fixed positionnée par JS (voir topbar.php) — .cb-admin-nav a
   overflow-x:auto pour le défilement mobile, qui écrêterait un enfant en
   position:absolute. */
.cb-admin-nav-dropdown-panel {
  position: fixed; transform: translate(-50%, 6px); padding-top: 10px;
  z-index: 1001; opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
}
.cb-admin-nav-dropdown-panel.open { opacity: 1; visibility: visible; transform: translate(-50%, 0); pointer-events: auto; }
.cb-admin-nav-dropdown-card {
  display: flex; flex-direction: column; gap: 2px; min-width: 180px;
  background: var(--white, #fff); border-radius: 18px;
  box-shadow: 0 24px 60px rgba(35,48,72,0.14), 0 2px 8px rgba(35,48,72,0.06);
  border: 1px solid rgba(35,48,72,0.06); padding: 10px;
}
.cb-admin-nav-dropdown-card a {
  font-size: 0.88rem; font-weight: 600; color: var(--marine);
  padding: 9px 12px; border-radius: 12px; transition: background 0.15s ease, color 0.15s ease;
}
.cb-admin-nav-dropdown-card a:hover { background: var(--green-100, #E9FBF8); color: var(--turquoise-dark); }
.cb-admin-nav a.active::before { opacity: 1; }
.cb-admin-nav a:active { transform: translateY(0) scale(0.97); }
.cb-admin-logout { font-size: 0.83rem; color: var(--slate); transition: color 0.15s; }
.cb-admin-logout:hover { color: var(--danger); }
.cb-admin-topbar-right { display: flex; align-items: center; gap: 20px; flex-shrink: 0; }

.cb-admin-search-wrap { position: relative; }
.cb-admin-search-input {
  width: 200px; padding: 9px 14px; border-radius: 999px; border: 1px solid rgba(35,48,72,0.12);
  font-family: inherit; font-size: 0.85rem; color: var(--marine); background: rgba(255,255,255,0.7);
  transition: width 0.2s ease, border-color 0.2s ease;
}
.cb-admin-search-input:focus { outline: none; border-color: var(--turquoise-dark); width: 260px; }
.cb-admin-search-results {
  display: none; position: absolute; top: calc(100% + 8px); right: 0; width: 320px; max-height: 420px; overflow-y: auto;
  background: #fff; border-radius: 16px; border: 1px solid rgba(35,48,72,0.08); box-shadow: var(--shadow-lg); padding: 8px; z-index: 200;
}
.cb-admin-search-results.open { display: block; }
.cb-admin-search-section { font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--slate); padding: 10px 12px 4px; }
.cb-admin-search-item { display: flex; flex-direction: column; gap: 1px; padding: 8px 12px; border-radius: 10px; text-decoration: none; }
.cb-admin-search-item:hover { background: rgba(80,221,196,0.12); }
.cb-admin-search-item-label { font-weight: 700; color: var(--marine); font-size: 0.86rem; }
.cb-admin-search-item-sub { font-size: 0.76rem; color: var(--slate); }
.cb-admin-search-empty { padding: 14px 12px; font-size: 0.82rem; color: var(--slate); }
@media (max-width: 900px) {
  .cb-admin-search-input { width: 140px; }
  .cb-admin-search-input:focus { width: 180px; }
  .cb-admin-search-results { width: 280px; }
}
.cb-admin-gear-wrap { position: relative; }
.cb-admin-gear-btn {
  display: flex; align-items: center; gap: 6px;
  font-size: 0.86rem; font-weight: 600; color: var(--marine); line-height: 1;
  background: rgba(35,48,72,0.045); border: 1px solid rgba(35,48,72,0.05);
  border-radius: 999px; padding: 9px 16px; cursor: pointer; transition: background 0.15s;
}
.cb-admin-gear-btn:hover { background: rgba(35,48,72,0.08); }
.cb-admin-gear-btn.active { background: rgba(80,221,196,0.18); border-color: rgba(38,188,161,0.3); text-decoration: none; }
/* Variante icône seule (Paramètres, Nos outils) — cercle plutôt que pilule, pas de libellé texte (demande explicite du 30/08/2026). */
.cb-admin-icon-btn { width: 46px; height: 46px; padding: 0; justify-content: center; font-size: 1.4rem; position: relative; }
.cb-admin-icon-btn svg { width: 24px; height: 24px; }
/* Info-bulle au survol (voir data-tooltip) plutôt que le title natif du
   navigateur — trop lent à apparaître et pas dans le style de l'admin. */
.cb-admin-icon-btn::after {
  content: attr(data-tooltip); position: absolute; top: calc(100% + 8px); left: 50%;
  transform: translateX(-50%) translateY(-4px); background: var(--marine); color: #fff;
  font-size: 0.72rem; font-weight: 600; white-space: nowrap; padding: 5px 10px; border-radius: 8px;
  opacity: 0; pointer-events: none; transition: opacity 0.15s, transform 0.15s; z-index: 200;
}
.cb-admin-icon-btn:hover::after { opacity: 1; transform: translateX(-50%) translateY(0); }
.cb-admin-gear-menu {
  display: none; position: absolute; top: calc(100% + 10px); right: 0; min-width: 220px;
  background: #fff; border-radius: 16px; box-shadow: var(--shadow-lg); border: 1px solid rgba(35,48,72,0.06);
  padding: 8px; flex-direction: column; z-index: 200;
}
.cb-admin-gear-menu.open { display: flex; }
.cb-admin-gear-user { font-size: 0.78rem; font-weight: 700; color: var(--slate); padding: 8px 12px 10px; word-break: break-all; }
.cb-admin-gear-menu a { font-size: 0.87rem; font-weight: 600; color: var(--marine); padding: 9px 12px; border-radius: 10px; transition: background 0.15s; }
.cb-admin-gear-menu a:hover { background: var(--bg); }
.cb-admin-gear-menu a.danger { color: var(--danger); }
.cb-admin-gear-sep { height: 1px; background: rgba(35,48,72,0.07); margin: 6px 4px; }
.cb-admin-main { max-width: 1080px; margin: 0 auto; padding: 36px 28px 100px; }
/* overflow-x:auto (pas flex-wrap) : un sous-onglet ne doit jamais passer à
   la ligne (ça déplacerait le contenu en dessous de façon imprévisible) —
   même traitement que .cb-admin-nav sur mobile, où plusieurs pastilles +
   un lien aligné à droite (ex. "Tous les articles →" dans Contenus) ne
   tiennent pas sur 375px et faisaient déborder toute la page (constaté en
   test le 05/09/2026, aucune barre de défilement visible mais le viewport
   s'élargissait silencieusement). */
.cb-admin-subtabs { display: flex; gap: 6px; margin-bottom: 24px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.cb-admin-subtabs::-webkit-scrollbar { display: none; }
.cb-admin-subtabs a {
  font-size: 0.86rem; font-weight: 600; color: var(--slate); padding: 8px 16px; border-radius: 999px;
  background: rgba(35,48,72,0.045); border: 1px solid rgba(35,48,72,0.05); transition: background 0.15s, color 0.15s;
  flex-shrink: 0; white-space: nowrap;
}
.cb-admin-subtabs a:hover { color: var(--marine); }
.cb-admin-subtabs a.active { background: #fff; color: var(--marine); box-shadow: var(--shadow-sm); }
.cb-admin-header-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 28px; flex-wrap: wrap; gap: 12px; position: relative; }

/* Conteneur du titre de page (et de ce qui l'accompagne). */
.cb-admin-title-wrap { display: inline-flex; align-items: flex-start; gap: 22px; position: relative; }
.cb-admin-header-row h1 { font-size: 1.6rem; font-weight: 800; letter-spacing: -0.01em; }

/* Tuiles de statistiques (dashboard parrainage) */
.cb-admin-stats-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 20px; }
.cb-admin-stat {
  background: rgba(255,255,255,0.66); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(35,48,72,0.06); border-radius: 16px; padding: 18px 20px; box-shadow: var(--shadow-sm);
}
.cb-admin-stat .n { font-size: 1.6rem; font-weight: 800; letter-spacing: -0.01em; }
.cb-admin-stat .l { font-size: 0.8rem; color: var(--slate); margin-top: 2px; }
@media (max-width: 720px) { .cb-admin-stats-row { grid-template-columns: repeat(2, 1fr); } }

/* Tuile "montant dû/en attente" (ex. commission restant à verser) — doit se
   détacher visuellement des tuiles neutres au premier coup d'œil, sans
   lire le libellé (audit graphiste du 10/09/2026, même ton que
   .cb-pl-report-tile-due de partenaires-logement.css). */
.cb-admin-stat.due { background: var(--amber-bg); border-color: rgba(184,134,11,0.3); }
.cb-admin-stat.due .n { color: var(--amber); }

/* ==========================================================================
   Boutons de l'Outil Admin — système unique (revue des boutons du 03/10/2026)
   Registre « outil pro » (Linear, Stripe) : une seule forme, trois tailles,
   une hiérarchie lisible d'un coup d'œil.
     Variantes : (défaut) primaire turquoise · .secondary (contour discret)
                 · .ghost (texte, fond au survol) · .danger (destructif)
                 · .violet (action IA / mise en avant, violet 700 pour l'AA)
     Tailles   : .sm 32px · (défaut) 36px · .lg / .cb-admin-publish-btn 44px
     Icône seule : .icon (carré, aria-label + title obligatoires)
     États     : :hover, :active (enfoncé), :focus-visible (anneau),
                 :disabled / [aria-disabled], .is-loading (sablier animé)
   Sur écran tactile, chaque bouton offre au moins 44px de hauteur.
   ========================================================================== */
.cb-admin-btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 36px; max-width: 100%; padding: 6px 14px; border-radius: 10px;
  border: 1px solid transparent; background: var(--turquoise); color: var(--marine);
  font-family: inherit; font-size: 0.86rem; font-weight: 600; line-height: 1.2; letter-spacing: -0.005em;
  white-space: nowrap; text-decoration: none; vertical-align: middle; cursor: pointer; user-select: none;
  -webkit-tap-highlight-color: transparent;
  box-shadow: 0 1px 2px rgba(35,48,72,0.10), inset 0 1px 0 rgba(255,255,255,0.28);
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .08s ease;
}
.cb-admin-btn svg { width: 16px; height: 16px; flex-shrink: 0; }
.cb-admin-btn:hover { background: #3CD3B8; color: var(--marine); box-shadow: 0 2px 8px rgba(38,188,161,0.28), inset 0 1px 0 rgba(255,255,255,0.28); }
.cb-admin-btn:active { background: #2EC7AC; transform: translateY(1px); box-shadow: none; }
.cb-admin-btn:focus-visible { outline: 2px solid var(--marine); outline-offset: 2px; }

.cb-admin-btn.secondary { background: #fff; border-color: rgba(35,48,72,0.16); color: var(--marine); box-shadow: 0 1px 2px rgba(35,48,72,0.05); }
.cb-admin-btn.secondary:hover { background: #F6F8FB; border-color: rgba(35,48,72,0.28); box-shadow: 0 1px 2px rgba(35,48,72,0.06); }
.cb-admin-btn.secondary:active { background: #EEF1F5; }

.cb-admin-btn.ghost { background: transparent; border-color: transparent; color: var(--slate); box-shadow: none; }
.cb-admin-btn.ghost:hover { background: rgba(35,48,72,0.06); color: var(--marine); box-shadow: none; }
.cb-admin-btn.ghost:active { background: rgba(35,48,72,0.10); }

.cb-admin-btn.danger { background: #fff; border-color: rgba(224,69,90,0.45); color: #C42D43; box-shadow: 0 1px 2px rgba(35,48,72,0.05); }
.cb-admin-btn.danger:hover { background: var(--danger-bg); border-color: var(--danger); color: #B0263B; }
.cb-admin-btn.danger:active { background: #FBE2E6; }
.cb-admin-btn.danger.solid { background: #D23A50; border-color: transparent; color: #fff; }
.cb-admin-btn.danger.solid:hover { background: #B92F44; }

.cb-admin-btn.violet { background: #5022D3; color: #fff; box-shadow: 0 1px 2px rgba(80,34,211,0.25), inset 0 1px 0 rgba(255,255,255,0.18); }
.cb-admin-btn.violet:hover { background: #4419B8; color: #fff; box-shadow: 0 2px 10px rgba(80,34,211,0.30); }
.cb-admin-btn.violet:active { background: #3A14A0; }

.cb-admin-btn.link { min-height: 0; padding: 0; background: none; border: none; box-shadow: none; border-radius: 4px; color: #13806D; font-size: inherit; }
.cb-admin-btn.link:hover { background: none; box-shadow: none; color: var(--marine); text-decoration: underline; text-underline-offset: 3px; }
.cb-admin-btn.link:active { transform: none; }
.cb-admin-btn.sm { min-height: 32px; padding: 4px 11px; border-radius: 8px; font-size: 0.8rem; gap: 5px; }
.cb-admin-btn.sm svg { width: 14px; height: 14px; }
.cb-admin-btn.lg { min-height: 44px; padding: 10px 20px; border-radius: 12px; font-size: 0.92rem; }
.cb-admin-btn.icon { width: 36px; padding: 0; }
.cb-admin-btn.sm.icon { width: 32px; }
.cb-admin-btn.block, .cb-w100.cb-admin-btn { width: 100%; }

.cb-admin-btn:disabled, .cb-admin-btn[aria-disabled="true"], .cb-admin-btn.is-disabled {
  opacity: 0.5; cursor: not-allowed; transform: none; box-shadow: none;
}
.cb-admin-btn.is-loading { color: transparent !important; pointer-events: none; }
.cb-admin-btn.is-loading > * { visibility: hidden; }
.cb-admin-btn.is-loading::after {
  content: ''; position: absolute; left: 50%; top: 50%; width: 16px; height: 16px; margin: -8px 0 0 -8px;
  border: 2px solid rgba(35,48,72,0.25); border-top-color: var(--marine); border-radius: 50%;
  animation: cb-admin-btn-spin .7s linear infinite;
}
.cb-admin-btn.violet.is-loading::after, .cb-admin-btn.danger.solid.is-loading::after { border-color: rgba(255,255,255,0.35); border-top-color: #fff; }
@keyframes cb-admin-btn-spin { to { transform: rotate(360deg); } }

@media (pointer: coarse) {
  .cb-admin-btn:not(.link), .cb-admin-btn.sm:not(.link) { min-height: 44px; }
  .cb-admin-btn.icon, .cb-admin-btn.sm.icon { width: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  .cb-admin-btn { transition: none; }
  .cb-admin-btn:active { transform: none; }
  .cb-admin-btn.is-loading::after { animation-duration: 2s; }
}

/* Liste articles */
.cb-admin-table {
  width: 100%; background: rgba(255,255,255,0.68); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-radius: 18px; overflow: hidden; border: 1px solid rgba(35,48,72,0.06); border-collapse: collapse; box-shadow: var(--shadow-sm);
}
.cb-admin-table th { text-align: left; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--slate); background: rgba(35,48,72,0.02); padding: 13px 20px; border-bottom: 1px solid rgba(35,48,72,0.06); font-weight: 700; }
.cb-admin-table th.cb-admin-sortable { cursor: pointer; user-select: none; transition: color 0.15s; }
.cb-admin-table th.cb-admin-sortable:hover { color: var(--marine); }
.cb-admin-table th.cb-admin-sortable::after { content: '⇅'; margin-left: 6px; opacity: 0.35; font-size: 0.85em; }
.cb-admin-table th.cb-admin-sort-asc::after { content: '↑'; opacity: 1; color: var(--turquoise-dark); }
.cb-admin-table th.cb-admin-sort-desc::after { content: '↓'; opacity: 1; color: var(--turquoise-dark); }
.cb-admin-table td { padding: 14px 20px; border-bottom: 1px solid rgba(35,48,72,0.05); font-size: 0.92rem; vertical-align: middle; }
.cb-admin-table tr:last-child td { border-bottom: none; }
.cb-admin-table tr { transition: background 0.1s; }
.cb-admin-table tbody tr:hover { background: rgba(35,48,72,0.025); }
.cb-admin-table-cover { width: 56px; height: 40px; border-radius: 9px; object-fit: cover; background: var(--bg); }
.cb-admin-title-cell { font-weight: 700; }
.cb-admin-title-cell .slug { font-weight: 400; color: var(--slate); font-size: 0.8rem; }
.cb-admin-badge { display: inline-block; padding: 4px 12px; border-radius: 50px; font-size: 0.7rem; font-weight: 700; }
.cb-admin-badge.published { background: #E9FBF8; color: var(--turquoise-dark); }
.cb-admin-badge.draft { background: #F1F3F6; color: var(--slate); }
.cb-admin-badge.accepted { background: var(--violet-100); color: var(--violet-500); }
.cb-admin-badge.urgent { background: var(--danger-bg); color: var(--danger); }
/* Actions de ligne : boutons texte (tertiaires), fond discret au survol. */
.cb-admin-row-actions { display: flex; align-items: center; gap: 2px; margin-left: -8px; }
.cb-admin-row-actions a, .cb-admin-row-actions button { display: inline-flex; align-items: center; gap: 5px; min-height: 30px; padding: 4px 8px; border-radius: 7px; font-family: inherit; font-size: 0.84rem; font-weight: 600; line-height: 1.2; white-space: nowrap; color: var(--slate); background: none; border: none; cursor: pointer; text-decoration: none; transition: color .15s ease, background-color .15s ease; }
.cb-admin-row-actions a:hover, .cb-admin-row-actions button:hover { color: var(--marine); background: rgba(35,48,72,0.06); }
.cb-admin-row-actions .danger:hover, .cb-admin-row-actions button.danger:hover { color: #C42D43; background: var(--danger-bg); }
.cb-admin-row-actions form { display: inline-flex; margin: 0; }
@media (pointer: coarse) { .cb-admin-row-actions a, .cb-admin-row-actions button { min-height: 40px; } }
.cb-admin-empty {
  text-align: center; padding: 48px 20px 64px; color: var(--slate);
  background: rgba(255,255,255,0.6); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-radius: 18px; border: 1px solid rgba(35,48,72,0.06);
}
.cb-admin-empty-mascot { height: 120px; width: auto; margin: 0 auto 16px; }

.cb-admin-list-toolbar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 18px; }
.cb-admin-list-search {
  flex: 1; min-width: 200px; padding: 11px 16px; border: 1.5px solid var(--border); border-radius: 12px;
  background: #fff; font-size: 0.9rem; transition: border-color 0.15s;
}
.cb-admin-list-search:focus { outline: none; border-color: var(--turquoise-dark); }
.cb-admin-list-category-filter {
  padding: 11px 16px; border: 1.5px solid var(--border); border-radius: 12px; background: #fff; font-size: 0.88rem; color: var(--marine);
}
.cb-admin-status-filter { flex-shrink: 0; }
.cb-admin-status-filter label { flex: none; padding: 8px 14px; }
.cb-admin-count { font-weight: 400; opacity: 0.6; margin-left: 2px; }

/* Formulaire édition */
.cb-admin-form-grid { display: grid; grid-template-columns: 1fr 300px; gap: 24px; align-items: start; }
.cb-admin-form-grid > * { min-width: 0; }
.cb-admin-sidebar { position: sticky; top: 88px; display: flex; flex-direction: column; }
.cb-admin-split { display: grid; grid-template-columns: 1.2fr 1fr; gap: 24px; align-items: start; }
.cb-admin-split-col { min-width: 0; }
.cb-admin-split-col h2 { font-size: 1.05rem; font-weight: 800; margin-bottom: 14px; }
.cb-admin-table-scroll { overflow-x: auto; }
@media (max-width: 900px) { .cb-admin-split { grid-template-columns: minmax(0, 1fr); } }

/* Fiche candidat Entretiens : en-tête "hero" avec avatar, au lieu d'un simple
   h1 + badge — plus lisible pour une fiche qu'on ouvre/referme en boucle
   pendant une session de recrutement (audit graphisme 30/08/2026). */
.cb-ent-hero {
  display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
  background: rgba(255,255,255,0.66); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(35,48,72,0.06); border-radius: 18px; padding: 16px 24px;
  margin-bottom: 16px; box-shadow: var(--shadow-sm);
}
.cb-ent-hero-avatar {
  flex: 0 0 auto; width: 58px; height: 58px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.15rem; font-weight: 800; color: #fff;
  background: linear-gradient(135deg, var(--turquoise) 0%, var(--violet-500) 100%);
}
.cb-ent-hero-info { flex: 1 1 220px; min-width: 0; }
.cb-ent-hero-name-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cb-ent-hero-info h2 { font-size: 1.25rem; font-weight: 800; }
.cb-ent-hero-poste { font-size: 0.86rem; color: var(--slate); margin-top: 2px; font-weight: 600; }
.cb-ent-hero-contacts { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 8px; font-size: 0.84rem; }
.cb-ent-hero-contacts a { color: var(--marine); }
.cb-ent-hero-progress { flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.cb-ent-hero-progress-ring {
  --pct: 0; width: 54px; height: 54px; border-radius: 50%;
  background: conic-gradient(var(--turquoise) calc(var(--pct) * 1%), rgba(35,48,72,0.08) 0);
  display: flex; align-items: center; justify-content: center;
}
.cb-ent-hero-progress-ring span {
  width: 42px; height: 42px; border-radius: 50%; background: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.72rem; font-weight: 800; color: var(--marine);
}
.cb-ent-hero-progress .l { font-size: 0.68rem; color: var(--slate); font-weight: 600; }

/* Rangée de boutons d'action de la fiche candidat (Envoyer/Marquer/Accepté/
   Refusé) : volontairement PAS .cb-admin-row-actions, qui aplati tous les
   boutons en simples liens (pensé pour les actions compactes d'une ligne de
   tableau) — ici ce sont de vrais boutons pleine taille (bug visuel constaté
   le 30/08/2026 : "Envoyer l'invitation"/"Marquer entretien réalisé"
   perdaient leur fond et leur padding, contrairement à "Accepté"/"Refusé"
   qui redéfinissent leur propre fond et gagnaient malgré tout sur la
   spécificité CSS). */
.cb-ent-actions-row { display: flex; flex-wrap: wrap; gap: 10px; }

/* Bloc "lien de l'entretien" : mis en avant en premier dans la colonne de
   gauche, c'est l'action la plus fréquente sur cette fiche (renvoyer/copier
   le lien avant l'envoi de l'invitation). */
.cb-ent-link-card input[readonly] { font-size: 0.82rem; color: var(--slate); background: var(--bg); }
.cb-ent-link-actions { display: flex; gap: 8px; }
.cb-ent-link-actions .cb-admin-btn { flex: 1; text-align: center; }

/* Timeline de la conversation, plutôt qu'une liste de champs plate — chaque
   question porte une icône selon son type et un style distinct répondu/en
   attente. */
.cb-ent-timeline { display: flex; flex-direction: column; gap: 4px; }
.cb-ent-timeline-item { display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px solid rgba(35,48,72,0.06); }
.cb-ent-timeline-item:last-child { border-bottom: none; padding-bottom: 0; }
.cb-ent-timeline-icon {
  flex: 0 0 auto; width: 34px; height: 34px; border-radius: 50%; background: var(--violet-100);
  display: flex; align-items: center; justify-content: center; font-size: 0.95rem;
}
.cb-ent-timeline-item.answered .cb-ent-timeline-icon { background: #E9FBF8; }
.cb-ent-timeline-body { flex: 1; min-width: 0; }
.cb-ent-timeline-question { font-size: 0.86rem; font-weight: 700; color: var(--marine); margin-bottom: 6px; }
.cb-ent-timeline-empty { font-size: 0.8rem; color: var(--slate); font-style: italic; }
.cb-ent-timeline-answer { font-size: 0.88rem; color: var(--marine); background: var(--bg); border-radius: 12px; padding: 10px 14px; line-height: 1.5; }
.cb-ent-timeline-video { width: 100%; max-width: 340px; border-radius: 14px; background: #111; display: block; }


/* Carte "Offres CVthèque" de la fiche candidat Entretiens (sélection provisoire, voir render.php). */
.cb-ent-offres-selected { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.cb-ent-offres-selected .cb-admin-badge { display: inline-flex; align-items: center; gap: 6px; }
.cb-ent-offres-selected .cb-admin-badge button {
  border: none; background: none; cursor: pointer; color: inherit; font-size: 1rem; line-height: 1;
  padding: 0; opacity: 0.6;
}
.cb-ent-offres-selected .cb-admin-badge button:hover { opacity: 1; }
.cb-ent-offres-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.cb-ent-offre-new { display: flex; gap: 8px; flex-wrap: wrap; padding-top: 14px; border-top: 1px solid rgba(35,48,72,0.06); }
.cb-ent-offre-new input { flex: 1 1 120px; padding: 9px 12px; border: 1.5px solid var(--border); border-radius: 10px; font-family: inherit; font-size: 0.85rem; }
.cb-ent-offre-new input:focus { outline: none; border-color: var(--turquoise-dark); }

/* Fiche candidat Entretiens : garder l'ensemble visible sans scroll de page
   sur un écran desktop courant (demande explicite du 30/08/2026) — cartes
   resserrées (gap au lieu de la marge par défaut de .cb-admin-card, plus
   généreuse), et les deux listes qui peuvent grandir sans limite (historique
   de conversation, offres CVthèque) scrollent dans leur propre carte plutôt
   que de pousser toute la page vers le bas. */
.cb-ent-fiche-split { gap: 18px; }
.cb-ent-fiche-col { display: flex; flex-direction: column; gap: 12px; }
.cb-ent-fiche-col > .cb-admin-card, .cb-ent-fiche-col > form { margin-bottom: 0; }
.cb-ent-fiche-col .cb-admin-card, .cb-admin-split-col .cb-admin-card { padding: 18px 20px; }
.cb-ent-timeline, .cb-ent-offres-list { max-height: 280px; overflow-y: auto; }

.cb-admin-card {
  background: rgba(255,255,255,0.66); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(35,48,72,0.06); border-radius: 18px; padding: 24px;
  margin-bottom: 20px; box-shadow: var(--shadow-sm); transition: box-shadow 0.15s;
}
.cb-admin-card h2 { font-size: 0.98rem; font-weight: 700; margin-bottom: 16px; }
/* Certaines cartes ont un max-width fixe en inline (ex. formulaire "Nouveau
   parrain", 480px) pensé pour desktop — sur mobile, ce max-width dépasse la
   largeur d'écran disponible et provoque un débordement de page. Priorité
   donnée à la largeur réelle de l'écran, quel que soit le style inline. */
@media (max-width: 520px) { .cb-admin-card { max-width: 100% !important; } }
/* Grille de propositions de contenu (admin/contenus/) — une carte par post/article proposé. */
/* min à 280px (pas 340) : sur un écran de 375px, .cb-admin-main (28px de padding de chaque côté)
   ne laisse que ~319px de large — un min plus haut fait déborder la carte hors de sa zone de
   contenu (constaté en test le 05/09/2026, silencieusement sans barre de défilement visible). */
.cb-contenus-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }
.cb-contenus-card { margin-bottom: 0; }
.cb-contenus-card-meta { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.cb-contenus-date-input { border: 1.5px solid var(--border); border-radius: 10px; padding: 6px 10px; font-size: 0.8rem; color: var(--marine); }
.cb-contenus-card textarea { width: 100%; resize: vertical; }
.cb-contenus-card-actions { display: flex; gap: 8px; margin-top: 14px; flex-wrap: wrap; }
.cb-contenus-card-actions .cb-admin-btn { flex: 1; min-width: 110px; padding: 9px 12px; font-size: 0.82rem; }
.cb-contenus-image-suggestion img { width: 100%; border-radius: 12px; display: block; margin-bottom: 6px; }
.cb-contenus-image-suggestion .hint { margin: 0; }

/* Grille 2 colonnes pour une fiche détail (ex. commande) composée de plusieurs .cb-admin-card — une carte peut s'étendre sur toute la largeur via grid-column: 1 / -1. */
.cb-admin-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
.cb-admin-detail-grid .cb-admin-card { margin-bottom: 0; }
@media (max-width: 720px) { .cb-admin-detail-grid { grid-template-columns: minmax(0, 1fr); } }
.cb-admin-field { margin-bottom: 18px; }
.cb-admin-field:last-child { margin-bottom: 0; }
.cb-admin-field label { display: block; font-size: 0.82rem; font-weight: 600; color: var(--slate); margin-bottom: 7px; }
.cb-admin-field .hint { font-size: 0.76rem; color: var(--slate); margin-top: 5px; line-height: 1.4; }
/* Ligne "Créé le / Modifié le" des fiches (voir cb_admin_render_dates_meta dans admin-data/lib.php). */
.cb-admin-dates-meta { font-size: 0.78rem; color: var(--slate); margin-top: 4px; }
.cb-admin-field .hint.warn { color: var(--danger); }
.cb-admin-field input[type=text], .cb-admin-field input[type=date], .cb-admin-field input[type=datetime-local], .cb-admin-field input[type=number], .cb-admin-field input[type=email], .cb-admin-field input[type=tel], .cb-admin-field textarea, .cb-admin-field select {
  width: 100%; padding: 11px 14px; border: 1.5px solid var(--border); border-radius: 12px; background: #fff;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.cb-admin-field textarea { resize: vertical; }
.cb-admin-field input:focus, .cb-admin-field textarea:focus, .cb-admin-field select:focus {
  outline: none; border-color: var(--turquoise-dark); box-shadow: 0 0 0 3px rgba(38,188,161,0.12);
}
#cbTitleInput { font-size: 1.15rem; font-weight: 700; padding: 14px 16px; }

/* Paire de champs (valeur + unité) au sein d'un même .cb-admin-field — pattern répété en inline (style="display:flex;gap:8px") dans plusieurs formulaires (affiliés notamment), extrait en classe réutilisable (audit webmaster 30/08/2026). */
.cb-admin-field-row { display: flex; gap: 8px; }
.cb-admin-field-row > * { flex: 1; }

/* Encart d'information contextuelle (ex. "pré-rempli depuis une demande reçue via le site") — même usage que .cb-admin-empty mais pour une info positive, pas un état vide. */
.cb-admin-callout { background: var(--violet-100); border-radius: 10px; padding: 10px 14px; font-size: 0.82rem; margin-bottom: 16px; }
.cb-admin-required::after { content: ' *'; color: var(--danger); }
.cb-admin-charcount { font-size: 0.76rem; color: var(--slate); text-align: right; margin-top: 5px; }
.cb-admin-charcount.over { color: var(--danger); font-weight: 700; }

.cb-admin-error-card { border-color: var(--danger); background: var(--danger-bg); color: var(--danger); }
.cb-admin-error-card strong { display: block; margin-bottom: 8px; }
.cb-admin-error-card ul { margin-left: 20px; }

/* Réglages avancés (repliable) */
.cb-admin-advanced { margin-bottom: 20px; }
.cb-admin-advanced summary {
  cursor: pointer; font-size: 0.9rem; font-weight: 700; color: var(--marine);
  padding: 14px 20px; list-style: none; display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  background: rgba(255,255,255,0.66); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(35,48,72,0.06); border-radius: 14px; transition: border-color 0.15s;
}
.cb-admin-advanced summary .hint { font-weight: 400; margin: 0; }
.cb-admin-advanced summary::-webkit-details-marker { display: none; }
.cb-admin-advanced summary::before { content: '▸'; color: var(--slate); transition: transform 0.15s; font-size: 0.8rem; }
.cb-admin-advanced[open] summary::before { transform: rotate(90deg); }
.cb-admin-advanced[open] summary { border-radius: 14px 14px 0 0; border-bottom-color: transparent; }
.cb-admin-advanced .cb-admin-card { margin-top: 0; border-radius: 0 0 14px 14px; border-top: none; box-shadow: none; }

/* Sidebar publication + couverture */
.cb-admin-publish-card { display: flex; flex-direction: column; gap: 0; }
.cb-admin-publish-btn { width: 100%; margin-top: 4px; min-height: 44px; padding: 10px 16px; border-radius: 12px; font-size: 0.92rem; }
.cb-admin-cover-preview { width: 100%; aspect-ratio: 16/9; border-radius: 14px; object-fit: cover; background: var(--bg); margin-bottom: 12px; border: 1px solid rgba(35,48,72,0.06); }
.cb-admin-cover-placeholder {
  width: 100%; aspect-ratio: 16/9; border-radius: 14px; background: var(--bg); border: 1.5px dashed var(--border);
  display: flex; align-items: center; justify-content: center; color: var(--slate); font-size: 0.85rem; margin-bottom: 12px;
}
.cb-admin-upload-btn {
  display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; min-height: 36px; padding: 6px 14px;
  background: #fff; border: 1px solid rgba(35,48,72,0.16); box-shadow: 0 1px 2px rgba(35,48,72,0.05);
  border-radius: 10px; font-size: 0.86rem; font-weight: 600; color: var(--marine); cursor: pointer; white-space: nowrap;
  transition: border-color .15s ease, background-color .15s ease;
}
.cb-admin-upload-btn:hover { border-color: rgba(35,48,72,0.28); background: #F6F8FB; }

/* Éditeur de contenu + toolbar */
.cb-editor-toolbar { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; position: relative; }
.cb-editor-toolbar button {
  display: inline-flex; align-items: center; gap: 5px; min-height: 32px; padding: 4px 11px;
  background: #fff; border: 1px solid rgba(35,48,72,0.14); border-radius: 8px; white-space: nowrap;
  font-size: 0.8rem; font-weight: 600; cursor: pointer; color: var(--marine); transition: background-color .15s ease, border-color .15s ease;
}
.cb-editor-toolbar button:hover { background: #F6F8FB; border-color: rgba(35,48,72,0.28); }
#cbContentTextarea {
  min-height: 420px; font-family: 'SFMono-Regular', Menlo, monospace; font-size: 0.88rem; line-height: 1.65;
}

.cb-link-search-panel {
  position: absolute; top: 100%; left: 0; margin-top: 8px; background: #fff; border: 1px solid rgba(35,48,72,0.06);
  border-radius: 14px; box-shadow: var(--shadow-lg); width: 320px; max-height: 320px; overflow: hidden;
  display: none; flex-direction: column; z-index: 50;
}
.cb-link-search-panel.open { display: flex; }
.cb-link-search-panel input { border: none; border-bottom: 1px solid var(--border); padding: 13px 16px; font-size: 0.88rem; }
.cb-link-search-panel input:focus { outline: none; }
.cb-link-search-results { overflow-y: auto; }
.cb-link-search-result { padding: 11px 16px; cursor: pointer; font-size: 0.85rem; border-bottom: 1px solid #f2f4f7; transition: background 0.1s; }
.cb-link-search-result:hover { background: var(--bg); }
.cb-link-search-result .u { color: var(--slate); font-size: 0.76rem; }

.cb-admin-status-toggle { display: flex; background: var(--bg); border-radius: 12px; padding: 4px; gap: 4px; }
.cb-admin-status-toggle label { flex: 1; text-align: center; padding: 9px 10px; border-radius: 9px; font-size: 0.82rem; font-weight: 700; cursor: pointer; color: var(--slate); transition: background 0.15s, color 0.15s; white-space: nowrap; }
.cb-admin-status-toggle input { display: none; }
.cb-admin-status-toggle input:checked + label { background: #fff; color: var(--marine); box-shadow: var(--shadow-sm); }
/* Un contrôle à 3-4 options (Toutes/En attente/Vérifiées/Publiées) ne tient
   pas toujours sur un écran étroit une fois replié sur sa propre ligne —
   scroll horizontal plutôt que des libellés tronqués ou un débordement de
   page (même logique que .cb-admin-nav, voir plus haut). */
@media (max-width: 480px) {
  .cb-admin-status-toggle { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .cb-admin-status-toggle label { flex: none; }
}

.cb-admin-checkbox-group { display: flex; flex-wrap: wrap; gap: 8px; }
.cb-admin-checkbox { display: flex; align-items: center; gap: 6px; background: var(--bg); border: 1px solid rgba(35,48,72,0.06); border-radius: 50px; padding: 6px 12px; font-size: 0.8rem; font-weight: 600; color: var(--slate); cursor: pointer; transition: background 0.15s, border-color 0.15s, color 0.15s; }
.cb-admin-checkbox input { accent-color: var(--turquoise-dark); }
.cb-admin-checkbox:has(input:checked) { background: var(--turquoise); border-color: var(--turquoise); color: var(--marine); }

/* Formulaire de création "one-shot" replié par défaut (campagne, compte de
   connexion, ajustement crédits — fiche entreprise CVthèque, 11/09/2026) :
   garde le style bouton réel (cohérence avec le reste de l'admin) mais en
   variante secondary, jamais en concurrence visuelle avec un vrai CTA
   principal de la carte. */
.cb-admin-toggle-form { margin-top: 10px; }
.cb-admin-toggle-form summary { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; list-style: none; }
.cb-admin-toggle-form summary::-webkit-details-marker { display: none; }
.cb-admin-toggle-form summary .label { background: #fff; border: 1.5px solid var(--border); color: var(--marine); font-weight: 700; font-size: 0.85rem; padding: 9px 18px; border-radius: 999px; transition: border-color 0.15s, background 0.15s; }
.cb-admin-toggle-form summary:hover .label { border-color: var(--marine); background: var(--bg); }
.cb-admin-toggle-form[open] summary { margin-bottom: 14px; }
.cb-admin-toggle-form[open] summary .label { border-color: var(--turquoise-dark); background: var(--turquoise-tint, var(--bg)); }

/* Journal fusionné (crédits + équipe), replié par défaut — texte discret,
   pas de chrome de bouton, pour ne pas se confondre avec le menu
   "Paramètres" (qui utilise aussi <details> mais en pilule ronde). */
.cb-admin-journal { margin-top: 8px; }
.cb-admin-journal summary { cursor: pointer; list-style: revert; font-weight: 700; color: var(--marine); font-size: 0.92rem; }
.cb-admin-journal summary::marker { color: var(--turquoise-dark); }
.cb-admin-journal[open] summary { margin-bottom: 12px; }

/* Gestion des taxonomies (catégories/villes de l'annuaire) */
.cb-admin-taxo-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.cb-admin-taxo-row { display: flex; gap: 8px; align-items: center; }
.cb-admin-taxo-rename { display: flex; gap: 8px; flex: 1; }
.cb-admin-taxo-rename input[type=text] { flex: 1; padding: 8px 12px; border: 1.5px solid var(--border); border-radius: 10px; }
.cb-admin-taxo-add { display: flex; gap: 8px; padding-top: 12px; border-top: 1px solid var(--border); }
.cb-admin-taxo-add input[type=text] { flex: 1; padding: 10px 14px; border: 1.5px solid var(--border); border-radius: 10px; }
.cb-admin-taxo-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; }
@media (max-width: 720px) {
  .cb-admin-taxo-grid { grid-template-columns: minmax(0, 1fr); }
  .cb-admin-taxo-row { flex-wrap: wrap; }
}

@media (max-width: 900px) {
  .cb-admin-form-grid { grid-template-columns: minmax(0, 1fr); }
  .cb-admin-sidebar { position: static; }
}

/* Assistant IA */
.cb-ai-card { border-color: rgba(129,94,229,0.25); background: linear-gradient(165deg, var(--violet-100) 0%, #fff 65%); }
.cb-ai-header { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 4px; }
.cb-ai-spark { font-size: 1.3rem; line-height: 1; }
.cb-ai-header h2 { margin-bottom: 3px; }
.cb-ai-header .hint { margin: 0; }
.cb-ai-subsection { padding-top: 16px; margin-top: 16px; border-top: 1px solid rgba(129,94,229,0.15); }
.cb-ai-subsection-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.cb-ai-subsection-head h3 { font-size: 0.87rem; font-weight: 700; color: var(--marine); }
.cb-ai-subsection-head button { flex-shrink: 0; }
.cb-suggest-results { display: flex; flex-direction: column; gap: 10px; margin-top: 16px; }
.cb-suggest-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; background: #fff; border: 1px solid rgba(35,48,72,0.06); border-radius: 12px; padding: 12px 16px; }
.cb-suggest-row-text { flex: 1; min-width: 0; }
.cb-suggest-row-label { font-size: 0.74rem; font-weight: 700; color: var(--violet-500); text-transform: uppercase; letter-spacing: 0.03em; margin-bottom: 3px; }
.cb-suggest-row-value { font-size: 0.9rem; color: var(--marine); }
.cb-suggest-row button { white-space: nowrap; flex-shrink: 0; }
.cb-suggest-links-heading { font-size: 0.82rem; font-weight: 700; color: var(--slate); margin-top: 6px; }

/* Génération IA : banque d'images */
.cb-gen-images-list { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 12px; }
.cb-gen-image-row { position: relative; width: 108px; border: 1px solid rgba(35,48,72,0.06); border-radius: 12px; overflow: hidden; background: #fff; }
.cb-gen-image-row.is-cover { border-color: var(--violet-500); box-shadow: 0 0 0 1px var(--violet-500); }
.cb-gen-image-row img { width: 100%; height: 78px; object-fit: cover; display: block; }
.cb-gen-image-remove-btn { position: absolute; top: 4px; right: 4px; width: 20px; height: 20px; line-height: 18px; padding: 0; border: none; border-radius: 50%; background: rgba(0,0,0,0.6); color: #fff; font-size: 0.7rem; cursor: pointer; }
.cb-gen-image-cover-btn { display: block; width: 100%; border: none; border-top: 1px solid var(--border); background: var(--bg); color: var(--marine); font-size: 0.66rem; font-weight: 600; padding: 5px 4px; cursor: pointer; line-height: 1.2; }
.cb-gen-image-cover-btn:hover { background: #eef1f5; }
.cb-gen-image-row.is-cover .cb-gen-image-cover-btn { background: var(--violet-500); color: #fff; }

/* Demande de modification IA */
.cb-revise-box { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--border); }
.cb-revise-box textarea { width: 100%; }

/* ====================== Module CRM ======================
   L'ancienne barre latérale propre au CRM (.cb-crm-sidebar) a été retirée
   le 03/10/2026 : la navigation principale (admin/partials/nav.php) la
   remplace. */
.cb-crm-main-wrap { max-width: none; margin: 0 24px 0 116px; }
.cb-crm-content { min-width: 0; }

.cb-crm-kanban { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; align-items: stretch; } /* colonnes à la même hauteur : toute la colonne reçoit les cartes (06/10/2026) */
.cb-crm-kanban-col {
  background: rgba(255,255,255,0.5); border: 1px solid rgba(35,48,72,0.06); border-radius: 16px;
  padding: 10px; min-height: 120px; display: flex; flex-direction: column; gap: 8px; transition: background 0.15s, border-color 0.15s;
}
.cb-crm-kanban-col.cb-crm-dragover { background: rgba(80,221,196,0.18); border-color: var(--turquoise-dark); }
.cb-crm-kanban-col-head { display: flex; align-items: center; justify-content: space-between; font-size: 0.72rem; font-weight: 700; color: var(--slate); padding: 4px 8px 8px; text-transform: uppercase; letter-spacing: 0.02em; }
.cb-crm-kanban-count { background: rgba(35,48,72,0.06); border-radius: 999px; padding: 1px 8px; font-weight: 700; }
.cb-crm-kanban-cards { display: flex; flex-direction: column; gap: 8px; min-height: 40px; flex: 1; }
.cb-crm-card {
  background: #fff; border: 1px solid rgba(35,48,72,0.06); border-radius: 12px; padding: 12px 14px;
  cursor: grab; box-shadow: var(--shadow-sm); transition: box-shadow 0.15s, opacity 0.15s;
}
.cb-crm-card:active { cursor: grabbing; }
.cb-crm-card.cb-crm-dragging { opacity: 0.4; }
/* Safari : une carte glissable doit le déclarer, sinon le glisser-déposer ne démarre pas (06/10/2026). */
.cb-crm-card[draggable="true"] { -webkit-user-drag: element; cursor: grab; }
.cb-crm-card-name { font-weight: 700; font-size: 0.88rem; }
.cb-crm-card-produit { font-size: 0.78rem; color: var(--slate); margin-top: 2px; }
.cb-crm-card-taches { font-size: 0.72rem; color: var(--violet-500); font-weight: 700; margin-top: 6px; }
.cb-crm-card-stagnant { font-size: 0.72rem; color: var(--danger); font-weight: 700; margin-top: 6px; }
.cb-crm-card-unqualified { display: inline-block; font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; color: var(--violet-500); background: var(--violet-100); border-radius: 999px; padding: 2px 9px; margin-top: 4px; }


/* Liens mailto:/tel: affichés partout où un contact apparaît dans le CRM (listes, fiche, cartes B2B) — voir cb_crm_mailto()/cb_crm_tel() dans partials/render.php. */
.cb-crm-contact-link { color: var(--marine); text-decoration: none; white-space: nowrap; }
.cb-crm-contact-link:hover { color: var(--turquoise-dark); text-decoration: underline; }

.cb-crm-barchart { display: flex; flex-direction: column; gap: 12px; }
.cb-crm-barchart-row { display: grid; grid-template-columns: 150px 1fr 110px; align-items: center; gap: 12px; font-size: 0.82rem; }
.cb-crm-barchart-label { color: var(--marine); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cb-crm-barchart-track { background: rgba(35,48,72,0.06); border-radius: 999px; height: 10px; overflow: hidden; }
.cb-crm-barchart-fill { background: linear-gradient(90deg, var(--turquoise), var(--violet-500)); height: 100%; border-radius: 999px; }
.cb-crm-barchart-value { text-align: right; font-weight: 700; color: var(--marine); white-space: nowrap; }
@media (max-width: 640px) {
  .cb-crm-barchart-row { grid-template-columns: 90px 1fr 80px; gap: 8px; font-size: 0.76rem; }
}

/* Chiffres clés de la page d'accueil admin (voir admin/index.php) — plus
   compacts que .cb-admin-stat (qui vit dans une carte déjà groupée), ici
   chaque KPI est sa propre carte cliquable vers le module concerné. */
.cb-dash-kpi-section { display: flex; flex-direction: column; gap: 20px; margin-bottom: 8px; }
.cb-dash-kpi-group-label {
  font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 800;
  color: var(--slate); margin-bottom: 10px;
}
.cb-dash-kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; }
.cb-dash-kpi-card {
  display: block; padding: 18px 20px;
  background: rgba(255,255,255,0.66); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(35,48,72,0.06); border-left: 3px solid var(--turquoise); border-radius: 14px;
  box-shadow: var(--shadow-sm); transition: transform 0.15s, box-shadow 0.15s;
}
/* Un accent de couleur par groupe (particuliers/entreprises/croissance) au lieu de ne compter que sur le libellé au-dessus — repère visuel immédiat en scannant la ligne. */
.cb-dash-kpi-group--b2c .cb-dash-kpi-card { border-left-color: var(--turquoise); }
.cb-dash-kpi-group--b2b .cb-dash-kpi-card { border-left-color: var(--violet-500); }
.cb-dash-kpi-group--growth .cb-dash-kpi-card { border-left-color: #E0A93A; }
.cb-dash-kpi-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.cb-dash-kpi-label { display: flex; align-items: center; gap: 6px; font-size: 0.78rem; color: var(--slate); font-weight: 600; line-height: 1.3; }
.cb-dash-kpi-icon { font-size: 0.95rem; }
.cb-dash-kpi-value { font-size: 1.55rem; font-weight: 800; color: var(--marine); margin-top: 6px; letter-spacing: -0.01em; }
.cb-dash-kpi-trend { font-size: 0.76rem; font-weight: 700; margin-top: 6px; }
.cb-dash-kpi-trend.up { color: var(--turquoise-dark); }
.cb-dash-kpi-trend.down { color: var(--danger); }
.cb-dash-kpi-trend.flat { color: var(--slate); }

/* "Pouls opérationnel" — liste compacte de compteurs cross-équipe, même carte que le bar chart d'acquisition (cb-crm-dash-card). */
.cb-dash-ops-row {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 10px 0; border-bottom: 1px solid rgba(35,48,72,0.06); color: var(--marine); font-size: 0.88rem;
}
.cb-dash-ops-row:last-child { border-bottom: none; padding-bottom: 0; }
.cb-dash-ops-row strong { font-size: 1rem; font-weight: 800; }
/* Signal à traiter en priorité (ex. dossiers qui stagnent) — rouge, comme le reste de l'admin pour "ça bloque". */
.cb-dash-ops-row.alert span, .cb-dash-ops-row.alert strong { color: var(--danger); font-weight: 700; }
/* Idem pour la liste "À traiter en premier" (voir admin/index.php) — carte bordée de rouge plutôt qu'une simple carte neutre parmi d'autres. */
.cb-admin-card.cb-dash-urgent { border: 1.5px solid rgba(224,69,90,0.4); background: var(--danger-bg); font-weight: 700; color: var(--danger); }

.cb-crm-dash-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 20px; }
@media (max-width: 900px) { .cb-crm-dash-grid { grid-template-columns: minmax(0, 1fr); } }
.cb-crm-dash-card h2 { font-size: 0.95rem; margin: 0 0 16px; }
.cb-crm-dash-substat { display: flex; justify-content: space-between; align-items: baseline; padding: 10px 0; border-top: 1px solid var(--border); }
.cb-crm-dash-substat:first-of-type { border-top: none; padding-top: 0; }
.cb-crm-dash-substat .n { font-size: 1.4rem; font-weight: 800; }
.cb-crm-dash-substat .l { font-size: 0.8rem; color: var(--slate); }

.cb-crm-modal-backdrop {
  position: fixed; inset: 0; background: rgba(35,48,72,0.4); backdrop-filter: blur(2px);
  display: none; align-items: center; justify-content: center; z-index: 500; padding: 20px;
}
.cb-crm-modal-backdrop.open { display: flex; }
.cb-crm-modal {
  background: #fff; border-radius: 20px; padding: 28px; width: 100%; max-width: 480px;
  max-height: 90vh; overflow-y: auto; box-shadow: var(--shadow-lg);
}
.cb-crm-modal h2 { font-size: 1.05rem; font-weight: 800; }
.cb-crm-modal .cb-admin-field { margin-bottom: 14px; }
/* Barre d'actions collée en bas de la modale (position: sticky), pas en fin
   de formulaire : sur un formulaire long (ex. fiche compte B2B), le bouton
   "Enregistrer" doit rester visible sans avoir à dérouler tout le contenu
   jusqu'au bout — demande explicite du 05/09/2026. Les marges/padding
   négatifs compensent le padding de .cb-crm-modal pour que la barre touche
   les bords et masque le contenu qui défile derrière elle. */
.cb-crm-modal-actions {
  display: flex; gap: 10px; justify-content: flex-end; margin: 20px -28px -28px; padding: 16px 28px;
  position: sticky; bottom: -28px; background: #fff; border-top: 1px solid var(--border); border-radius: 0 0 20px 20px;
}

/* En-tête avec pastille icône dégradée, pour les modales de création/édition. */
.cb-crm-modal-header { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 22px; }
.cb-crm-modal-icon {
  width: 44px; height: 44px; border-radius: 14px; flex-shrink: 0;
  background: linear-gradient(135deg, var(--turquoise) 0%, var(--violet-500) 100%);
  display: flex; align-items: center; justify-content: center; font-size: 1.25rem;
  box-shadow: 0 6px 16px rgba(80,221,196,0.3);
}
.cb-crm-modal-subtitle { font-size: 0.82rem; color: var(--slate); margin-top: 3px; }

/* Champs groupés par paire (nom/prénom, email/téléphone...) sur une ligne. */
.cb-crm-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cb-crm-form-section-label {
  font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--slate); margin: 18px 0 8px;
}
.cb-crm-form-section-label:first-child { margin-top: 0; }
.cb-crm-modal textarea { width: 100%; resize: vertical; }

@media (max-width: 900px) {
  .cb-crm-main-wrap { margin-left: 0; }
}

/* ====================== Rendez-vous + documents d'une démarche (fiche client CRM) ======================
   Amélioration UX du 22/09/2026 : ce bloc n'avait jusqu'ici que des styles
   inline minimaux (champ date au rendu navigateur brut, liste de documents
   sans hiérarchie visuelle, input file natif à côté d'un bouton) — reprend
   les conventions déjà en place ailleurs dans l'admin (cb-admin-field,
   cb-admin-btn, glass léger) plutôt que du CSS ad hoc. */
.cb-crm-rdv-docs { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border); }
.cb-crm-checkbox-inline { display: flex; align-items: center; gap: 8px; font-size: 0.85rem; font-weight: 600; margin: 10px 0 4px 0; cursor: pointer; }
.cb-crm-checkbox-inline input { width: 16px; height: 16px; }
.cb-crm-docs-label { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--slate); margin-bottom: 8px; }
.cb-crm-docs-empty { font-size: 0.85rem; color: var(--slate); margin-bottom: 10px; }
.cb-crm-doc-row {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 10px;
  background: rgba(35,48,72,0.035); margin-bottom: 6px; font-size: 0.85rem;
}
.cb-crm-doc-row svg { width: 15px; height: 15px; color: var(--slate); flex-shrink: 0; }
.cb-crm-doc-row a { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; color: var(--marine); }
.cb-crm-doc-row a:hover { color: var(--turquoise-dark); }
.cb-crm-doc-delete {
  background: none; border: none; color: var(--slate); cursor: pointer; font-size: 0.78rem;
  padding: 3px 7px; border-radius: 6px; flex-shrink: 0; transition: background 0.15s, color 0.15s;
}
.cb-crm-doc-delete:hover { background: var(--danger-bg); color: var(--danger); }

.cb-crm-doc-upload-form { display: flex; align-items: center; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.cb-crm-doc-upload-label {
  display: inline-flex; align-items: center; gap: 6px; background: #fff; border: 1.5px solid var(--border);
  border-radius: 999px; padding: 7px 14px; font-size: 0.8rem; font-weight: 600; color: var(--marine);
  cursor: pointer; transition: border-color 0.15s, background 0.15s;
}
.cb-crm-doc-upload-label:hover { border-color: var(--turquoise-dark); background: var(--bg); }
.cb-crm-doc-upload-label svg { width: 14px; height: 14px; }
.cb-crm-doc-upload-filename { font-size: 0.78rem; color: var(--slate); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 160px; }
.cb-crm-doc-upload-form .cb-admin-btn { padding: 7px 16px; font-size: 0.8rem; }

/* ====================== Messages espace client (fiche CRM, 23/09/2026) ======================
   Fil de discussion entre l'assistant IA / un conseiller et le client
   authentifié sur /mon-espace/ — voir mon-espace-data/chat.php. */
.cb-crm-chat-thread { max-height: 320px; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; margin: 10px 0 12px 0; }
.cb-crm-chat-bubble { padding: 9px 12px; border-radius: 12px; font-size: 0.85rem; line-height: 1.45; background: rgba(35,48,72,0.035); }
.cb-crm-chat-bubble--client { background: var(--green-100, #E9FBF8); }
.cb-crm-chat-bubble--admin { background: rgba(80,93,229,0.08); }
.cb-crm-chat-bubble-label { display: block; font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; color: var(--slate); margin-bottom: 3px; }
.cb-crm-chat-form { display: flex; gap: 8px; align-items: flex-end; }
.cb-crm-chat-form textarea { flex: 1; padding: 9px 12px; border: 1.5px solid var(--border); border-radius: 10px; font-size: 0.85rem; resize: vertical; min-height: 44px; }
.cb-crm-chat-form .cb-admin-btn { padding: 9px 16px; font-size: 0.82rem; }

/* ====================== Fiche client CRM (refonte UX 24/09/2026) ======================
   Hiérarchie : en-tête identité compact → alertes (seulement si action
   requise) → démarches en colonne principale (le travail du quotidien) →
   colonne latérale tâches / messages / infos de référence. */
.cb-admin-btn--sm { min-height: 32px; padding: 4px 11px !important; border-radius: 8px; font-size: 0.8rem !important; }
@media (pointer: coarse) { .cb-admin-btn--sm { min-height: 44px; } }
.cb-crm-count { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; padding: 0 7px; border-radius: 999px; background: rgba(35,48,72,0.07); color: var(--slate); font-size: 0.72rem; font-weight: 800; vertical-align: 2px; }
.cb-crm-link { background: none; border: none; padding: 0; color: var(--turquoise-dark); font-weight: 700; font-size: 0.8rem; cursor: pointer; text-decoration: none; font-family: inherit; }
.cb-crm-link:hover { text-decoration: underline; }
.cb-crm-link-danger { background: none; border: none; padding: 2px 6px; color: var(--slate); font-size: 0.8rem; font-weight: 700; cursor: pointer; border-radius: 6px; font-family: inherit; }
.cb-crm-link-danger:hover { color: var(--danger); background: var(--danger-bg); }

/* En-tête identité */
.cb-crm-client-head { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-bottom: 4px; }
.cb-crm-client-avatar { width: 56px; height: 56px; border-radius: 18px; background: linear-gradient(135deg, var(--turquoise), var(--violet-500)); color: #fff; font-weight: 800; font-size: 1.2rem; display: flex; align-items: center; justify-content: center; flex-shrink: 0; box-shadow: var(--shadow-md); }
.cb-crm-client-id { flex: 1 1 380px; min-width: 0; }
.cb-crm-client-title { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cb-crm-client-title h1 { font-size: 1.6rem; margin: 0; }
.cb-crm-client-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 6px; font-size: 0.86rem; color: var(--slate); }
.cb-crm-client-meta em { font-style: normal; color: var(--amber); font-weight: 600; }
.cb-crm-client-seen { font-weight: 600; }
.cb-crm-client-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }

/* Menus "⋯" */
.cb-crm-menu { position: relative; }
.cb-crm-menu > summary { list-style: none; cursor: pointer; }
.cb-crm-menu > summary::-webkit-details-marker { display: none; }
.cb-crm-dm-head .cb-crm-menu > summary { width: 32px; height: 32px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-weight: 800; color: var(--slate); }
.cb-crm-dm-head .cb-crm-menu > summary:hover { background: rgba(35,48,72,0.06); }
.cb-crm-menu-panel { position: absolute; right: 0; top: calc(100% + 6px); z-index: 30; min-width: 260px; background: #fff; border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow-lg); padding: 6px; display: flex; flex-direction: column; }
.cb-crm-menu-panel button { text-align: left; background: none; border: none; padding: 10px 12px; border-radius: 10px; font-family: inherit; font-size: 0.85rem; font-weight: 600; color: var(--marine); cursor: pointer; }
.cb-crm-menu-panel button:hover { background: var(--bg); }
.cb-crm-menu-panel button.danger { color: var(--danger); }
.cb-crm-menu-panel button.danger:hover { background: var(--danger-bg); }

/* Alertes */
.cb-crm-alerts { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 4px; }
.cb-crm-alert { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 999px; font-size: 0.82rem; font-weight: 700; text-decoration: none; }
.cb-crm-alert--urgent { background: var(--danger-bg); color: var(--danger); }
.cb-crm-alert--warn { background: var(--amber-bg); color: var(--amber); }
.cb-crm-alert--info { background: var(--violet-100); color: var(--violet-500); }
a.cb-crm-alert:hover { filter: brightness(0.97); }

/* Grille principale */
.cb-crm-fiche { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(300px, 1fr); gap: 24px; align-items: start; margin-top: 20px; }
@media (max-width: 1100px) { .cb-crm-fiche { grid-template-columns: minmax(0, 1fr); } }
.cb-crm-section-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.cb-crm-section-head h2 { font-size: 1.05rem; font-weight: 800; margin: 0; }
.cb-crm-empty-demarches { padding: 22px 24px; }

/* Carte démarche */
.cb-crm-dm { background: #fff; border: 1px solid var(--border); border-radius: 20px; box-shadow: var(--shadow-md); padding: 18px 20px 16px; margin-bottom: 16px; }
.cb-crm-dm--termine { border-color: rgba(38,188,161,0.35); }
.cb-crm-dm--annule { opacity: 0.75; }
.cb-crm-dm-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.cb-crm-dm-title { min-width: 0; }
.cb-crm-dm-title h3 { font-size: 1.08rem; font-weight: 800; margin: 4px 0 0; }
.cb-crm-dm-head-right { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.cb-crm-demarche-type { display: inline-block; font-size: 0.66rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.05em; padding: 3px 9px; border-radius: 999px; background: #E9FBF8; color: var(--turquoise-dark); }
.cb-crm-demarche-type--logement { background: var(--violet-100); color: var(--violet-500); }
.cb-crm-demarche-type--emploi { background: var(--amber-bg); color: var(--amber); }
.cb-crm-pay { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; font-size: 0.78rem; font-weight: 800; cursor: pointer; background: var(--amber-bg); color: var(--amber); border: 1.5px solid transparent; user-select: none; }
.cb-crm-pay input { width: 14px; height: 14px; accent-color: var(--turquoise-dark); }
.cb-crm-pay.is-paid { background: #E9FBF8; color: var(--turquoise-dark); }

/* Étapes cliquables */
.cb-crm-steps { list-style: none; display: flex; gap: 0; margin: 16px 0 12px; padding: 0; overflow-x: auto; }
.cb-crm-steps li { flex: 1 1 0; min-width: 110px; position: relative; }
.cb-crm-steps li:not(:last-child)::after { content: ''; position: absolute; top: 15px; left: calc(50% + 14px); right: calc(-50% + 14px); height: 2px; background: var(--border); }
.cb-crm-step { width: 100%; background: none; border: none; padding: 4px 4px 6px; display: flex; flex-direction: column; align-items: center; gap: 6px; cursor: pointer; font-family: inherit; border-radius: 12px; transition: background 0.15s ease; }
.cb-crm-step:not([disabled]):hover { background: var(--bg); }
.cb-crm-step[disabled] { cursor: default; }
.cb-crm-step-dot { width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--border); background: #fff; display: flex; align-items: center; justify-content: center; font-size: 0.7rem; font-weight: 800; color: #fff; position: relative; z-index: 1; }
.cb-crm-step-label { font-size: 0.74rem; font-weight: 600; color: var(--slate); text-align: center; line-height: 1.25; }
.cb-crm-step--fait .cb-crm-step-dot { background: var(--turquoise-dark); border-color: var(--turquoise-dark); }
.cb-crm-step--courant .cb-crm-step-dot { background: var(--turquoise); border-color: var(--turquoise); box-shadow: 0 0 0 5px rgba(80,221,196,0.22); }
.cb-crm-step--courant .cb-crm-step-label { color: var(--marine); font-weight: 800; }
.cb-crm-step--negatif.cb-crm-step--courant .cb-crm-step-dot { background: var(--danger); border-color: var(--danger); box-shadow: 0 0 0 5px var(--danger-bg); }
.cb-crm-step--negatif .cb-crm-step-label { color: var(--danger); }

/* Résumé en une ligne */
.cb-crm-dm-summary { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 0.8rem; color: var(--slate); padding: 10px 12px; background: var(--bg); border-radius: 12px; }
.cb-crm-dm-summary .is-set { color: var(--marine); font-weight: 600; }
.cb-crm-dm-summary .is-missing { color: var(--slate); }
.cb-crm-from-client { color: var(--violet-500); }

/* Sections repliables */
.cb-crm-dm-sec { border-top: 1px solid var(--border); margin-top: 10px; }
.cb-crm-dm-sec:first-of-type { margin-top: 12px; }
.cb-crm-dm-sec > summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 2px; cursor: pointer; font-size: 0.88rem; font-weight: 700; color: var(--marine); }
.cb-crm-dm-sec > summary::-webkit-details-marker { display: none; }
.cb-crm-dm-sec > summary::before { content: '›'; font-size: 1.1rem; color: var(--slate); transition: transform 0.15s ease; margin-right: 2px; }
.cb-crm-dm-sec[open] > summary::before { transform: rotate(90deg); }
.cb-crm-dm-sec > summary > span:first-child { flex: 1; display: flex; align-items: center; gap: 6px; }
.cb-crm-dm-sec-hint { font-size: 0.76rem; font-weight: 700; color: var(--turquoise-dark); }
.cb-crm-dm-sec[open] .cb-crm-dm-sec-hint { visibility: hidden; }
.cb-crm-dm-sec > *:not(summary) { margin-bottom: 12px; }

.cb-crm-rdv-form { display: flex; flex-direction: column; gap: 10px; }
.cb-crm-rdv-form label, .cb-crm-logement-grid label { display: flex; flex-direction: column; gap: 5px; font-size: 0.74rem; font-weight: 700; color: var(--slate); }
.cb-crm-rdv-grid { display: grid; grid-template-columns: 210px 1fr; gap: 10px; }
@media (max-width: 700px) { .cb-crm-rdv-grid { grid-template-columns: minmax(0, 1fr); } }
.cb-crm-rdv-form input[type="datetime-local"], .cb-crm-rdv-form input[type="text"], .cb-crm-rdv-form textarea, .cb-crm-logement-grid select { width: 100%; padding: 9px 11px; border: 1.5px solid var(--border); border-radius: 10px; font-family: inherit; font-size: 0.86rem; background: #fff; color: var(--marine); font-weight: 500; }
.cb-crm-rdv-form input:focus, .cb-crm-rdv-form textarea:focus, .cb-crm-logement-grid select:focus { outline: none; border-color: var(--turquoise-dark); box-shadow: 0 0 0 3px rgba(80,221,196,0.2); }
.cb-crm-rdv-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; justify-content: flex-end; }
.cb-crm-rdv-actions .cb-crm-checkbox-inline { margin: 0 auto 0 0; font-size: 0.8rem; flex-direction: row; }

.cb-crm-doc-row { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 10px; font-size: 0.84rem; }
.cb-crm-doc-row:hover { background: var(--bg); }
.cb-crm-doc-row svg { width: 16px; height: 16px; color: var(--turquoise-dark); flex-shrink: 0; }
.cb-crm-doc-row a { font-weight: 600; color: var(--marine); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cb-crm-doc-row--client svg { color: var(--violet-500); }
.cb-crm-doc-row form { margin: 0; }

.cb-crm-fil-item { margin-top: 8px; font-size: 0.84rem; line-height: 1.5; padding: 10px 12px; border-radius: 12px; background: var(--bg); }
.cb-crm-fil-item .slug { display: block; margin-bottom: 2px; }
.cb-crm-fil-item--client { background: var(--violet-100); }
.cb-crm-visible { color: var(--turquoise-dark); }
.cb-crm-qa { font-size: 0.84rem; line-height: 1.5; margin-top: 8px; }

.cb-crm-logement-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; align-items: start; }
@media (max-width: 700px) { .cb-crm-logement-grid { grid-template-columns: minmax(0, 1fr); } }
.cb-crm-logement-crit { display: flex; flex-direction: column; gap: 6px; font-size: 0.86rem; font-weight: 600; }
.cb-crm-logement-crit span { display: inline-block; min-width: 150px; font-size: 0.74rem; font-weight: 700; color: var(--slate); }
.cb-crm-logement-crit .is-missing { color: #B4690E; font-weight: 600; }

.cb-crm-dm-actions { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 14px; margin-top: 4px; border-top: 1px solid var(--border); }
.cb-crm-dm-actions .cb-admin-btn { padding: 9px 16px; font-size: 0.84rem; }
.cb-crm-inline-upload { margin: 0; }
.cb-crm-inline-upload label { cursor: pointer; display: inline-flex; align-items: center; }

/* Colonne latérale */
.cb-crm-fiche-side { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 90px; }
@media (max-width: 1100px) { .cb-crm-fiche-side { position: static; } }
.cb-crm-side-card { padding: 16px 18px !important; margin: 0 !important; }
.cb-crm-side-details > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; }
.cb-crm-side-details > summary::-webkit-details-marker { display: none; }
.cb-crm-side-details > summary h2 { font-size: 1.05rem; font-weight: 800; margin: 0; }
.cb-crm-side-details > summary::after { content: '›'; font-size: 1.2rem; color: var(--slate); transition: transform 0.15s ease; }
.cb-crm-side-details[open] > summary::after { transform: rotate(90deg); }
.cb-crm-side-details[open] > summary { margin-bottom: 12px; }

.cb-crm-task { display: flex; gap: 10px; align-items: flex-start; padding: 10px 8px; border-radius: 12px; }
.cb-crm-task-check { display: flex; padding: 2px; margin: -2px; cursor: pointer; }
.cb-crm-task-body[data-crm-action] { cursor: pointer; flex: 1; }
.cb-crm-task-body[data-crm-action]:hover .cb-crm-task-title { color: var(--turquoise-dark); }
.cb-crm-task-body[data-crm-action]:focus-visible { outline: 2px solid var(--turquoise); outline-offset: 2px; border-radius: 8px; }
.cb-crm-task:hover { background: var(--bg); }
.cb-crm-task input { margin-top: 3px; width: 16px; height: 16px; accent-color: var(--turquoise-dark); flex-shrink: 0; }
.cb-crm-task-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cb-crm-task-title { font-size: 0.86rem; font-weight: 700; color: var(--marine); }
.cb-crm-task-meta { font-size: 0.74rem; color: var(--slate); }
.cb-crm-task-meta.is-late { color: var(--danger); font-weight: 700; }
/* Date de tâche au choix (08/10/2026) : le champ date reste invisible, le lien ouvre son calendrier. */
.cb-crm-date-pick { position: relative; display: inline-block; }
.cb-crm-date-pick input[type="date"] { position: absolute; left: 0; bottom: 0; width: 1px; height: 1px; opacity: 0; pointer-events: none; border: 0; padding: 0; }
.cb-crm-task-desc { font-size: 0.78rem; color: var(--slate); white-space: pre-line; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.cb-crm-task.is-done .cb-crm-task-title { text-decoration: line-through; color: var(--slate); font-weight: 600; }
.cb-crm-done-tasks > summary { cursor: pointer; font-size: 0.78rem; font-weight: 700; color: var(--slate); padding: 6px 8px; }

#cbCrmChat .cb-crm-chat-thread { max-height: 320px; overflow-y: auto; }
.cb-crm-chat-form textarea { width: 100%; }
/* Réponse au client (08/10/2026) : zone d'écriture plus grande, qui s'agrandit avec le texte (admin-crm.js). */
[data-crm-chat-reply-form] textarea { min-height: 170px; max-height: 60vh; line-height: 1.5; font-size: 0.9rem; padding: 12px 14px; }
.cb-crm-chat-form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 8px; }

.cb-crm-dl { display: grid; grid-template-columns: auto 1fr; gap: 8px 14px; font-size: 0.85rem; margin: 0; }
.cb-crm-dl dt { color: var(--slate); font-weight: 700; font-size: 0.78rem; }
.cb-crm-dl dd { margin: 0; color: var(--marine); font-weight: 600; }

.cb-crm-timeline { list-style: none; margin: 0; padding: 0 0 0 14px; border-left: 2px solid var(--border); max-height: 420px; overflow-y: auto; }
.cb-crm-timeline-item { position: relative; padding: 0 0 12px 12px; display: flex; flex-direction: column; gap: 1px; }
.cb-crm-timeline-item::before { content: ''; position: absolute; left: -20px; top: 4px; width: 10px; height: 10px; border-radius: 50%; background: var(--slate); border: 2px solid #fff; }
.cb-crm-timeline-item--client::before { background: var(--violet-500); }
.cb-crm-timeline-item--equipe::before { background: var(--turquoise-dark); }
.cb-crm-timeline-item--partenaire::before { background: var(--amber); }
.cb-crm-timeline-date { font-size: 0.68rem; font-weight: 700; color: var(--slate); }
.cb-crm-timeline-title { font-size: 0.82rem; font-weight: 600; color: var(--marine); }
.cb-crm-timeline-detail { font-size: 0.78rem; color: var(--slate); }
#cbCrmChat .cb-crm-chat-form { flex-direction: column; align-items: stretch; gap: 0; }

/* ====================== Liens de paiement (fiche client, 24/09/2026) ====================== */
.cb-crm-pay-lines { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
.cb-crm-pay-line { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border: 1.5px solid var(--border); border-radius: 12px; cursor: pointer; font-size: 0.88rem; }
.cb-crm-pay-line:has(input:checked) { border-color: var(--turquoise-dark); background: #F2FCFA; }
.cb-crm-pay-line input { width: 16px; height: 16px; accent-color: var(--turquoise-dark); }
.cb-crm-pay-line span { flex: 1; font-weight: 600; }
.cb-crm-pay-libre > summary { cursor: pointer; font-size: 0.82rem; font-weight: 700; color: var(--slate); }
.cb-crm-pay-total { display: flex; justify-content: space-between; align-items: baseline; margin: 14px 0 4px; padding-top: 12px; border-top: 1px solid var(--border); }
.cb-crm-pay-total strong { font-size: 1.3rem; }
.cb-crm-share-url { display: flex; gap: 8px; margin: 4px 0 14px; }
.cb-crm-share-url input { flex: 1; min-width: 0; padding: 10px 12px; border: 1.5px solid var(--border); border-radius: 10px; font-size: 0.8rem; color: var(--slate); background: var(--bg); }
.cb-crm-share-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 560px) { .cb-crm-share-grid { grid-template-columns: minmax(0, 1fr); } }
.cb-crm-share-btn { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 14px; border: 1.5px solid var(--border); border-radius: 14px; background: #fff; font-family: inherit; font-size: 0.92rem; font-weight: 800; color: var(--marine); cursor: pointer; text-align: left; transition: border-color 0.15s ease, background 0.15s ease; }
.cb-crm-share-btn span { font-size: 1.2rem; line-height: 1; margin-bottom: 4px; }
.cb-crm-share-btn small { font-size: 0.72rem; font-weight: 600; color: var(--slate); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.cb-crm-share-btn:not([disabled]):hover { border-color: var(--turquoise-dark); background: #F2FCFA; }
.cb-crm-share-btn--wa:not([disabled]):hover { border-color: #25D366; background: #F0FBF4; }
.cb-crm-share-btn[disabled] { opacity: 0.5; cursor: not-allowed; }
.cb-crm-share-btn.is-done { border-color: var(--turquoise-dark); background: #E9FBF8; opacity: 1; }
.cb-crm-share-preview { font-size: 0.82rem; color: var(--slate); background: var(--bg); padding: 10px 12px; border-radius: 10px; margin-top: 8px; line-height: 1.5; word-break: break-word; }
.cb-crm-lien { padding: 10px 0; border-top: 1px solid var(--border); display: flex; flex-direction: column; gap: 3px; }
.cb-crm-lien:first-of-type { border-top: none; padding-top: 0; }
.cb-crm-lien-main { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.cb-crm-lien-libelle { font-size: 0.82rem; font-weight: 600; color: var(--marine); }
.cb-crm-lien-meta { font-size: 0.74rem; color: var(--slate); }
.cb-crm-contrat-steps { list-style: none; margin: 10px 0 8px; padding: 0; display: grid; gap: 6px; }
.cb-crm-contrat-steps li { display: flex; align-items: center; gap: 8px; font-size: 0.8rem; color: var(--slate); }
.cb-crm-contrat-steps li span { width: 18px; height: 18px; flex-shrink: 0; border-radius: 50%; border: 1.5px solid var(--border); display: inline-flex; align-items: center; justify-content: center; font-size: 0.65rem; font-weight: 800; }
.cb-crm-contrat-steps li.is-done { color: var(--marine); font-weight: 600; }
.cb-crm-contrat-steps li.is-done span { background: var(--turquoise); border-color: var(--turquoise); color: var(--marine); }
.cb-crm-contrat-steps li em { font-style: normal; font-weight: 500; color: var(--slate); font-size: 0.74rem; margin-left: auto; }
.cb-crm-contrat-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.cb-crm-contrat-foot { display: flex; justify-content: space-between; gap: 8px; margin-top: 10px; }
.cb-crm-lien-warn { color: var(--amber); }
.cb-crm-lien .cb-crm-link { align-self: flex-start; margin-top: 2px; }
.cb-crm-task-cta { align-self: flex-start; margin-top: 6px; }

/* ====================== CRM — titres de vue (24/09/2026) ====================== */
.cb-crm-page-sub { font-size: 0.86rem; color: var(--slate); margin: 4px 0 0; font-weight: 500; }
.cb-crm-section-title { font-size: 1rem; font-weight: 800; color: var(--marine); margin: 30px 0 12px; }

/* ====================== CRM — kanbans et barres d'outils (refonte 24/09/2026) ====================== */
.cb-crm-board-toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 4px 0 16px; }
.cb-crm-board-search { flex: 1 1 260px; max-width: 380px; padding: 9px 14px; border: 1.5px solid var(--border); border-radius: 12px; background: #fff; font-size: 0.86rem; }
.cb-crm-board-search:focus { outline: none; border-color: var(--turquoise-dark); box-shadow: 0 0 0 3px rgba(80,221,196,0.2); }
.cb-crm-chip { border: 1.5px solid var(--border); background: #fff; color: var(--slate); font-family: inherit; font-size: 0.78rem; font-weight: 700; padding: 7px 12px; border-radius: 999px; cursor: pointer; }
.cb-crm-chip:hover { border-color: #cfd6e0; color: var(--marine); }
.cb-crm-chip.is-active { background: var(--marine); border-color: var(--marine); color: #fff; }
.cb-crm-kanban { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.cb-crm-kanban-col { background: #EBEEF4; border: 1px solid transparent; }
.cb-crm-kanban-col--final .cb-crm-kanban-col-head span:first-child { color: var(--turquoise-dark); }
.cb-crm-kanban-col--negatif { background: #F3F1F2; }
.cb-crm-kanban-col--negatif .cb-crm-kanban-col-head span:first-child { color: var(--danger); }
.cb-crm-kanban-col-sum { font-size: 0.74rem; font-weight: 700; color: var(--slate); padding: 0 8px; margin-top: -6px; }
.cb-crm-kanban-empty { border: 1.5px dashed #cfd6e0; border-radius: 12px; padding: 16px; text-align: center; font-size: 0.76rem; color: var(--slate); }
.cb-crm-card { border: 1px solid var(--border); box-shadow: 0 1px 2px rgba(35,48,72,0.05); transition: box-shadow 0.15s, transform 0.15s, border-color 0.15s; }
.cb-crm-card:hover { box-shadow: var(--shadow-md); border-color: #d7dde6; transform: translateY(-1px); }
.cb-crm-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.cb-crm-card-amount { flex-shrink: 0; font-size: 0.72rem; font-weight: 800; padding: 2px 8px; border-radius: 999px; }
.cb-crm-card-amount.is-due { background: var(--amber-bg); color: var(--amber); }
.cb-crm-card-amount.is-paid { background: #E9FBF8; color: var(--turquoise-dark); }
.cb-crm-card-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 8px; font-size: 0.72rem; color: var(--slate); font-weight: 600; align-items: center; }
.cb-crm-card-meta .is-hot { color: var(--violet-500); font-weight: 800; }
.cb-crm-card-age { margin-left: auto; font-weight: 800; }
.cb-crm-card-age.is-warn { color: var(--amber); }
.cb-crm-card-age.is-late { color: var(--danger); }
.cb-crm-more-filters { position: relative; }
.cb-crm-more-filters > summary { list-style: none; }
.cb-crm-more-filters > summary::-webkit-details-marker { display: none; }
.cb-crm-more-filters-panel { position: absolute; z-index: 20; top: calc(100% + 6px); right: 0; background: #fff; border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow-lg); padding: 12px; flex-direction: column; align-items: stretch; min-width: 240px; }
.cb-crm-table-card { background: #fff; border: 1px solid var(--border); border-radius: 16px; box-shadow: var(--shadow-sm); }
.cb-crm-table td { vertical-align: middle; font-size: 0.85rem; }
.cb-crm-table tbody tr:hover { background: #F7F9FC; }
.cb-crm-person { display: flex; align-items: center; gap: 10px; }
.cb-crm-person-avatar { width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(135deg, var(--turquoise), var(--violet-500)); color: #fff; font-weight: 800; font-size: 0.78rem; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cb-crm-person-id { display: flex; flex-direction: column; min-width: 0; }
.cb-crm-person-id strong { font-size: 0.88rem; }
.cb-crm-person-id > span { font-size: 0.76rem; color: var(--slate); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cb-crm-tgroup { margin-top: 18px; }
.cb-crm-tgroup h2 { font-size: 0.82rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; color: var(--slate); margin: 0 0 8px; display: flex; align-items: center; gap: 8px; }
.cb-crm-tgroup--retard h2 { color: var(--danger); }
.cb-crm-tgroup--jour h2 { color: var(--turquoise-dark); }
.cb-crm-tgroup--faites > summary { list-style: none; cursor: pointer; }
.cb-crm-tgroup--faites > summary::-webkit-details-marker { display: none; }
.cb-crm-tlist { background: #fff; border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow-sm); }
.cb-crm-trow { display: flex; align-items: center; gap: 12px; padding: 10px 14px; }
.cb-crm-trow + .cb-crm-trow { border-top: 1px solid var(--border); }
.cb-crm-trow:hover { background: #F7F9FC; }
.cb-crm-trow[data-crm-action] { cursor: pointer; }
.cb-crm-trow-ville { display: inline-flex; align-items: center; gap: 3px; margin-left: 6px; padding: 1px 8px; border-radius: 999px; background: #EEF2FF; color: #3B4A8C; font-size: 0.74rem; font-weight: 700; }
.cb-crm-trow-meta.is-alerte { color: #A15C00; font-weight: 600; }
.cb-crm-task.is-surlignee { background: #E9FBF8; box-shadow: 0 0 0 2px var(--turquoise); transition: background .4s, box-shadow .4s; }
.cb-crm-trow[data-crm-action]:hover .cb-crm-trow-title { color: var(--turquoise-dark); }
.cb-crm-trow-check { width: 17px; height: 17px; accent-color: var(--turquoise-dark); flex-shrink: 0; cursor: pointer; }
.cb-crm-trow-body { flex: 1; min-width: 0; }
.cb-crm-trow-title { font-size: 0.88rem; font-weight: 700; color: var(--marine); }
.cb-crm-trow-meta { font-size: 0.76rem; color: var(--slate); margin-top: 2px; }
.cb-crm-trow-meta a { color: var(--turquoise-dark); font-weight: 700; }
.cb-crm-trow.is-done .cb-crm-trow-title { text-decoration: line-through; color: var(--slate); font-weight: 600; }
.cb-crm-trow .cb-crm-menu > summary { width: 30px; height: 30px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-weight: 800; color: var(--slate); }
.cb-crm-trow .cb-crm-menu > summary:hover { background: var(--bg); }

/* ====================== Entretiens — fiche candidat & liste (refonte 24/09/2026) ====================== */
/* Réponses de l'entretien en colonne principale (ce qu'on évalue), infos pratiques à droite. */
.cb-ent-fiche-split--v2 { grid-template-columns: minmax(300px, 1fr) minmax(0, 1.6fr); }
.cb-ent-fiche-split--v2 .cb-ent-fiche-main { order: 2; }
@media (max-width: 900px) { .cb-ent-fiche-split--v2 { grid-template-columns: minmax(0, 1fr); } .cb-ent-fiche-split--v2 .cb-ent-fiche-main { order: -1; } }
.cb-ent-steps { list-style: none; display: flex; gap: 0; margin: 18px 0 12px; padding: 14px 16px; background: #fff; border: 1px solid var(--border); border-radius: 16px; }
.cb-ent-step { flex: 1; display: flex; align-items: center; gap: 8px; font-size: 0.8rem; font-weight: 700; color: var(--slate); position: relative; }
.cb-ent-step:not(:last-child)::after { content: ''; flex: 1; height: 2px; background: var(--border); margin: 0 10px; }
.cb-ent-step--fait:not(:last-child)::after { background: var(--turquoise-dark); }
.cb-ent-step-dot { width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.72rem; border: 2px solid var(--border); background: #fff; flex-shrink: 0; }
.cb-ent-step--fait .cb-ent-step-dot { background: var(--turquoise-dark); border-color: var(--turquoise-dark); color: #fff; }
.cb-ent-step--courant { color: var(--marine); }
.cb-ent-step--courant .cb-ent-step-dot { background: var(--turquoise); border-color: var(--turquoise); color: var(--marine); box-shadow: 0 0 0 4px rgba(80,221,196,0.22); }
.cb-ent-step--refuse .cb-ent-step-dot { background: var(--danger); border-color: var(--danger); color: #fff; box-shadow: 0 0 0 4px var(--danger-bg); }
.cb-ent-next { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; padding: 16px 18px; border-radius: 16px; background: #fff; border: 1px solid var(--border); border-left: 4px solid var(--turquoise-dark); margin-bottom: 18px; position: relative; }
.cb-ent-next > div:first-child { display: flex; flex-direction: column; gap: 2px; flex: 1 1 280px; }
.cb-ent-next strong { font-size: 0.95rem; }
.cb-ent-next span { font-size: 0.82rem; color: var(--slate); }
.cb-ent-next--entretien_realise { border-left-color: var(--violet-500); background: linear-gradient(90deg, var(--violet-100), #fff 60%); }
.cb-ent-next--refuse { border-left-color: var(--danger); }
.cb-ent-next-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.cb-ent-btn-accept { background: var(--turquoise-dark) !important; color: var(--marine) !important; } /* marine sur turquoise foncé : 5,6:1 (AA), le blanc n'atteignait que 2,4:1 */
.cb-ent-refuse-link { position: absolute; right: 18px; bottom: -22px; background: none; border: none; font-family: inherit; font-size: 0.74rem; color: var(--slate); cursor: pointer; text-decoration: underline; }
.cb-ent-refuse-link:hover { color: var(--danger); }
.cb-ent-next--nouveau, .cb-ent-next--invitation_envoyee { margin-bottom: 30px; }
.cb-ent-wait { font-weight: 700; font-size: 0.8rem; color: var(--slate); }
.cb-ent-wait.is-late { color: var(--danger); }
.cb-ent-action { font-size: 0.78rem; font-weight: 700; color: var(--slate); }
.cb-ent-action.is-todo { color: var(--turquoise-dark); background: #E9FBF8; padding: 3px 10px; border-radius: 999px; }
.cb-ent-mail-preview { width: 100%; height: 420px; border: 1px solid var(--border); border-radius: 12px; background: #E9FBF8; }
.cb-ent-cond-resume { margin-top: 4px; font-size: 0.76rem; font-weight: 600; color: var(--violet-500); }
.cb-ent-cond-list { display: flex; flex-direction: column; gap: 8px; }
.cb-ent-cond-row { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1.2fr) minmax(0, 1fr) auto; gap: 6px; align-items: center; padding: 8px; background: var(--bg); border-radius: 10px; }
.cb-ent-cond-row select, .cb-ent-cond-row input { width: 100%; padding: 8px 10px; border: 1.5px solid var(--border); border-radius: 8px; font-size: 0.82rem; background: #fff; min-width: 0; }
.cb-ent-cond-remove { background: none; border: none; font-size: 0.9rem; color: var(--slate); cursor: pointer; padding: 4px 8px; border-radius: 6px; }
.cb-ent-cond-remove:hover { color: var(--danger); background: var(--danger-bg); }
@media (max-width: 640px) { .cb-ent-cond-row { grid-template-columns: minmax(0, 1fr); } }
.cb-ent-cond-row { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto; }
.cb-ent-cond-row [data-cond="depend_question_id"] { grid-column: 1 / -1; }

/* Revue mobile du 24/09/2026 — Safari iOS zoome automatiquement sur tout
   champ de saisie dont le texte fait moins de 16px, et ne dézoome pas
   ensuite : la page reste agrandie et déborde. 16px minimum sur mobile. */
@media (max-width: 768px) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="color"]):not([type="hidden"]),
  select,
  textarea { font-size: 16px !important; }
}

/* Trois champs côte à côte, empilés sur téléphone (revue mobile du 24/09/2026). */
.cb-admin-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
@media (max-width: 700px) { .cb-admin-grid-3 { grid-template-columns: minmax(0, 1fr); gap: 0; } }

/* Compte de test sur la fiche client (02/10/2026) */
.cb-crm-test-toggle { border: 1px dashed rgba(35,48,72,0.25); background: transparent; color: #5b6b82; font: inherit; font-size: 0.75rem; font-weight: 600; padding: 3px 10px; border-radius: 50px; cursor: pointer; opacity: 0.7; }
.cb-crm-test-toggle:hover { opacity: 1; }
.cb-crm-test-toggle.on { opacity: 1; border-style: solid; border-color: #f0b429; background: #FFF6DB; color: #8a5a00; }

/* Badge « Démo » sur les données de test affichées en mode démo (lib/donnees-test.php). */
.cb-admin-badge.cb-demo-badge { padding: 2px 8px; background: #FFF8E1; color: #8A6A00; font-size: 0.65rem; vertical-align: middle; }


/* ====== Leads : kanban plus lisible (05/10/2026) ====== */
.cb-leads-selbar { position: sticky; top: 8px; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap; background: var(--marine); color: #fff; border-radius: 14px; padding: 10px 14px; margin-bottom: 12px; box-shadow: 0 8px 22px rgba(35,48,72,0.22); }
.cb-leads-selbar[hidden] { display: none; }
.cb-leads-selbar-n { font-size: 0.88rem; }
.cb-leads-selbar-actions { display: inline-flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.cb-leads-selbar .cb-admin-btn.secondary { background: rgba(255,255,255,0.12); color: #fff; border-color: rgba(255,255,255,0.25); }
.cb-leads-selbar .cb-admin-btn.secondary:hover:not(:disabled) { background: rgba(255,255,255,0.22); }
.cb-leads-selbar .cb-leads-danger { background: #c8394a; border-color: #c8394a; }
.cb-leads-selbar .cb-admin-btn.link { color: rgba(255,255,255,0.8); }
.cb-leads-col .cb-crm-kanban-col-head { padding: 6px 6px 12px; font-size: 0.74rem; }
.cb-leads-col-title { display: inline-flex; align-items: center; gap: 8px; color: var(--marine); }
.cb-leads-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--violet-500); display: inline-block; }
.cb-leads-col--en_cours .cb-leads-dot { background: #E0A100; }
.cb-leads-col--termine .cb-leads-dot { background: #2E86DE; }
.cb-leads-col--client .cb-leads-dot { background: var(--turquoise-dark); }
.cb-leads-col--refuse .cb-leads-dot { background: #9aa6b8; }
.cb-leads-selectall { border: none; background: none; font: inherit; font-size: 0.7rem; font-weight: 700; color: var(--turquoise-dark); cursor: pointer; padding: 0; text-transform: none; letter-spacing: 0; }
.cb-leads-selectall:hover { text-decoration: underline; }
.cb-leads-col .cb-crm-card { padding: 12px 14px 12px; border-radius: 14px; }
.cb-leads-col .cb-crm-card-name { display: flex; align-items: center; gap: 9px; min-width: 0; font-size: 0.92rem; line-height: 1.25; }
.cb-leads-avatar { width: 30px; height: 30px; border-radius: 50%; background: var(--violet-100, #f1ecfd); color: var(--violet-500, #815EE5); font-size: 0.72rem; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cb-leads-col--client .cb-leads-avatar { background: #e9fbf8; color: var(--turquoise-dark); }
.cb-leads-col--refuse .cb-leads-avatar { background: #eef0f4; color: #8390a5; }
.cb-leads-col .cb-crm-card-check { width: 16px; height: 16px; margin: 0; accent-color: var(--violet-500, #815EE5); flex-shrink: 0; }
.cb-leads-col .cb-crm-card-age { font-size: 0.72rem; font-weight: 700; color: var(--slate); background: rgba(35,48,72,0.06); border-radius: 999px; padding: 2px 9px; white-space: nowrap; align-self: flex-start; }
.cb-leads-col .cb-crm-card-age.is-late { color: #c8394a; background: #fdecee; }
.cb-leads-col .cb-crm-card-produit { font-size: 0.8rem; line-height: 1.4; margin-top: 8px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--slate); }
.cb-leads-contacts { display: flex; flex-direction: column; gap: 3px; margin-top: 8px; min-width: 0; }
.cb-leads-contacts span { min-width: 0; }
.cb-leads-contacts a { display: block; font-size: 0.78rem; color: var(--slate); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-decoration: none; }
.cb-leads-contacts a:hover { color: var(--marine); text-decoration: underline; }
.cb-leads-col .cb-crm-card-meta { margin-top: 10px; padding-top: 9px; border-top: 1px solid rgba(35,48,72,0.07); }
.cb-leads-col .cb-crm-card.is-selected, .cb-leads-col .cb-crm-card:has(.cb-crm-card-check:checked) { border-color: var(--violet-500, #815EE5); box-shadow: 0 0 0 2px rgba(129,94,229,0.18); }


/* ====== Chat du site : liste de conversations (05/10/2026) ====== */
.cb-sup-list { display: flex; flex-direction: column; gap: 8px; }
.cb-sup-row { display: flex; align-items: center; gap: 14px; background: #fff; border: 1px solid var(--shell-line, rgba(35,48,72,0.08)); border-radius: 14px; padding: 12px 16px; color: inherit; text-decoration: none; box-shadow: 0 1px 2px rgba(35,48,72,0.04); transition: border-color .15s, box-shadow .15s, transform .15s; }
.cb-sup-row:hover { border-color: rgba(35,48,72,0.2); box-shadow: 0 6px 16px rgba(35,48,72,0.07); transform: translateY(-1px); }
.cb-sup-row:focus-visible { outline: 2px solid var(--turquoise-dark); outline-offset: 2px; }
.cb-sup-row.is-todo { border-left: 4px solid #c8394a; }
.cb-sup-row.is-unread .cb-sup-name { color: var(--marine); }
.cb-sup-row.is-unread .cb-sup-preview { color: var(--marine); font-weight: 600; }
.cb-sup-avatar { width: 40px; height: 40px; border-radius: 50%; background: var(--violet-100, #f1ecfd); color: var(--violet-500, #815EE5); font-weight: 800; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cb-sup-avatar.is-anon { background: #eef0f4; color: #8390a5; }
.cb-sup-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.cb-sup-line { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; min-width: 0; }
.cb-sup-name { font-size: 0.95rem; color: var(--marine); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.cb-sup-new { background: #c8394a; color: #fff; border-radius: 999px; font-size: 0.68rem; font-weight: 800; padding: 2px 8px; }
.cb-sup-preview { font-size: 0.84rem; color: var(--slate); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.4; }
.cb-sup-preview em { font-style: normal; font-weight: 700; opacity: .75; }
.cb-sup-side { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; flex-shrink: 0; }
.cb-sup-side time { font-size: 0.76rem; color: var(--slate); white-space: nowrap; }
@media (max-width: 720px) { .cb-sup-row { flex-wrap: wrap; } .cb-sup-side { flex-direction: row; align-items: center; width: 100%; justify-content: space-between; padding-left: 54px; } }

/* ===== Fiche client moderne (05/10/2026) ===== */
.cb-crm-client-head { gap: 20px; align-items: center; margin-bottom: 6px; }
.cb-crm-client-avatar { width: 64px; height: 64px; border-radius: 20px; font-size: 1.35rem; letter-spacing: .02em; box-shadow: 0 10px 24px rgba(80,34,211,0.22), inset 0 1px 0 rgba(255,255,255,0.35); }
.cb-crm-client-title { gap: 8px 10px; }
.cb-crm-client-title h1 { font-size: 1.85rem; letter-spacing: -0.02em; line-height: 1.15; margin-right: 4px; }
.cb-crm-client-meta { gap: 8px; margin-top: 10px; }
.cb-crm-client-meta > span { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 999px; background: rgba(255,255,255,0.7); border: 1px solid rgba(35,48,72,0.07); font-size: 0.8rem; color: var(--marine); }
.cb-crm-client-meta > span a { color: inherit; text-decoration: none; }
.cb-crm-client-meta > span a:hover { text-decoration: underline; }
.cb-crm-client-meta .cb-crm-client-seen { background: transparent; border-color: transparent; color: var(--slate); padding-left: 2px; font-weight: 500; }
.cb-crm-alerts { gap: 8px; margin: 18px 0 2px; }
.cb-crm-alert { padding: 7px 13px; font-size: 0.78rem; border: 1px solid transparent; }
.cb-crm-alert--warn { border-color: rgba(240,180,41,0.28); }
.cb-crm-alert--urgent { border-color: rgba(224,69,90,0.25); }
.cb-crm-alert--info { border-color: rgba(129,94,229,0.22); }

.cb-crm-fiche { gap: 22px; margin-top: 22px; }
.cb-crm-fiche-main { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.cb-crm-fiche .cb-admin-card { border-radius: 20px; border: 1px solid rgba(35,48,72,0.06); box-shadow: 0 1px 2px rgba(35,48,72,0.04), 0 12px 30px -16px rgba(35,48,72,0.18); }
.cb-crm-fiche .cb-crm-side-card { padding: 20px 22px !important; }
.cb-crm-fiche .cb-crm-side-card h2, .cb-crm-fiche .cb-crm-section-head h2 { font-size: 1rem; font-weight: 800; letter-spacing: -0.01em; }
.cb-crm-section-head { margin: 6px 2px 0; }
.cb-crm-fiche-main > .cb-crm-section-head { margin-bottom: 0; }
.cb-crm-section-head .cb-admin-btn { padding: 8px 16px; font-size: 0.82rem; }

/* Notes d'échange : champ et options soignés */
.cb-crm-notes-rapides textarea { width: 100%; box-sizing: border-box; min-height: 84px; padding: 12px 14px; border: 1.5px solid rgba(35,48,72,0.12); border-radius: 14px; background: #fff; font: inherit; font-size: 0.9rem; color: var(--marine); resize: vertical; transition: border-color .15s, box-shadow .15s; }
.cb-crm-notes-rapides textarea::placeholder { color: #98a4b8; }
.cb-crm-notes-rapides textarea:focus { outline: none; border-color: var(--turquoise-dark); box-shadow: 0 0 0 4px rgba(80,221,196,0.22); }
.cb-crm-notes-rapides .cb-crm-chat-form-actions { justify-content: space-between; flex-wrap: wrap; margin-top: 10px; }
.cb-crm-notes-rapides .cb-crm-checkbox-inline { margin: 0; font-weight: 500; color: var(--slate); }
.cb-crm-notes-rapides .cb-crm-checkbox-inline input { accent-color: var(--turquoise-dark); }
.cb-crm-notes-rapides select { padding: 6px 28px 6px 10px; border: 1.5px solid rgba(35,48,72,0.12); border-radius: 10px; background: #fff; font: inherit; font-size: 0.84rem; color: var(--marine); }
.cb-crm-fil-item { border-radius: 14px; padding: 12px 14px; background: rgba(35,48,72,0.035); }
.cb-crm-fil-item .slug { font-size: 0.72rem; color: var(--slate); font-weight: 600; }

/* Demande initiale */
.cb-crm-demande-initiale summary { cursor: pointer; }
.cb-crm-demande-initiale .cb-crm-qa { font-size: 0.9rem; line-height: 1.6; color: var(--marine); margin-top: 10px; }

/* Aucune démarche : état vide plus accueillant */
.cb-crm-empty-demarches { text-align: center; padding: 30px 24px !important; border: 1.5px dashed rgba(35,48,72,0.14) !important; background: rgba(255,255,255,0.45) !important; box-shadow: none !important; }
.cb-crm-empty-demarches p { margin: 0; }
.cb-crm-empty-demarches p + p { margin-top: 6px; }

/* Tâches : lignes plus aérées */
.cb-crm-task { padding: 12px 10px; border-radius: 14px; }
.cb-crm-task-title { font-size: 0.88rem; }
.cb-crm-task input { width: 18px; height: 18px; }

/* Origine du lead */
.cb-crm-origine-main { margin: 2px 0 10px; font-size: 1.05rem; font-weight: 800; color: var(--marine); letter-spacing: -0.01em; }
.cb-crm-origine-dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 14px; margin: 0; font-size: 0.82rem; }
.cb-crm-origine-dl dt { color: var(--slate); }
.cb-crm-origine-dl dd { margin: 0; color: var(--marine); font-weight: 600; word-break: break-word; }
.cb-crm-client-meta > span:empty { display: none; }

/* Fiche candidat (06/10/2026) : résultats de l'entretien visibles sans défiler */
.cb-ent-resultats--tete { margin-top: 14px; }
.cb-ent-resultats h2 { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.cb-ent-resultats-compte { font-size: 0.78rem; font-weight: 600; color: var(--slate); }
.cb-ent-resultats--tete .cb-ent-timeline { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 0 28px; }
.cb-ent-resultats--tete .cb-ent-timeline-item { padding: 10px 0; gap: 10px; }
.cb-ent-resultats--tete .cb-ent-timeline-item:last-child { border-bottom: 1px solid rgba(35,48,72,0.06); padding-bottom: 10px; }
.cb-ent-resultats--tete .cb-ent-timeline-icon { width: 28px; height: 28px; font-size: 0.85rem; }
.cb-ent-resultats--tete .cb-ent-timeline-question { margin-bottom: 4px; }
.cb-ent-resultats--tete .cb-ent-timeline-video { max-height: 240px; width: 100%; border-radius: 10px; background: #000; }
@media (min-width: 1025px) {
  .cb-ent-hero { padding-top: 14px; padding-bottom: 14px; }
  .cb-ent-steps { margin-top: 10px; margin-bottom: 10px; }
}
.cb-admin-btn.link.danger { background: transparent; border-color: transparent; box-shadow: none; color: #C42D43; }
.cb-admin-btn.link.danger:hover { background: var(--danger-bg); color: #B0263B; }

/* CVthèque — accès d'un compte à certaines campagnes (06/10/2026) */
.cb-acces-camp { display: inline-block; max-width: 280px; }
.cb-acces-camp > summary { cursor: pointer; color: var(--marine); font-weight: 600; font-size: 0.82rem; list-style: none; }
.cb-acces-camp > summary::-webkit-details-marker { display: none; }
.cb-acces-camp > summary::after { content: " ▾"; color: var(--slate); }
.cb-acces-camp-form { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; padding: 12px; background: #fff; border: 1px solid rgba(35,48,72,0.1); border-radius: 12px; box-shadow: 0 8px 24px rgba(35,48,72,0.08); font-size: 0.85rem; }
.cb-acces-camp-form label, .cb-acces-camp-liste label { display: flex; align-items: center; gap: 8px; font-weight: 500; }
.cb-acces-camp-liste { display: flex; flex-direction: column; gap: 6px; padding-left: 4px; }
.cb-acces-camp-form .cb-acces-camp-liste { padding-left: 22px; }
.cb-acces-camp-form button { align-self: flex-start; margin-top: 4px; }

/* Entretiens : vue kanban des candidats (06/10/2026) */
.cb-ent-vues { margin-left: auto; display: inline-flex; gap: 6px; }
.cb-ent-kanban { grid-template-columns: repeat(5, minmax(200px, 1fr)); overflow-x: auto; padding-bottom: 6px; }
.cb-ent-card { cursor: grab; }
.cb-ent-card:active { cursor: grabbing; }
.cb-ent-card .cb-crm-card-name { display: flex; align-items: center; gap: 8px; }
.cb-ent-card-av { width: 26px; height: 26px; font-size: 0.66rem; flex: 0 0 26px; }
.cb-ent-card .cb-crm-card-meta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.cb-ent-col--entretien_realise .cb-crm-kanban-col-head span:first-child { color: #16715a; }
#cbEntretienKanban[hidden], .cb-admin-table-scroll[hidden] { display: none !important; }
.cb-ent-kanban { grid-template-columns: repeat(5, minmax(165px, 1fr)); }
/* CVthèque : recherche dans tous les candidats (06/10/2026) */
/* Barre de recherche CVthèque (21/10/2026) : champ arrondi avec loupe, anneau turquoise au focus. */
.cb-cvt-recherche { display: flex; gap: 8px; margin: 0 0 16px; align-items: center; }
.cb-cvt-recherche input, .tc-barre input[type=search] { flex: 1; min-width: 0; font: inherit; font-size: .95rem; color: #233048; padding: 12px 18px 12px 44px; border-radius: 999px; border: 1px solid rgba(35,48,72,.12); background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%238a94a7' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") no-repeat 16px center; box-shadow: 0 1px 2px rgba(35,48,72,.05); transition: border-color .15s, box-shadow .15s; }
.cb-cvt-recherche input:focus, .tc-barre input[type=search]:focus { outline: none; border-color: #50DDC4; box-shadow: 0 0 0 4px rgba(80,221,196,.22); }
.cb-cvt-recherche input::placeholder, .tc-barre input[type=search]::placeholder { color: #9aa5b8; }
.cb-cvt-recherche .cb-admin-btn, .tc-barre .cb-admin-btn { border-radius: 999px; padding: 11px 20px; }
.cb-ent-cv a, .cb-ent-cv-ajout { font-weight: 600; color: var(--marine); cursor: pointer; }
.cb-ent-cv-ajout:hover { color: var(--turquoise-dark); }

/* Sélecteur d'emojis des champs de texte (06/10/2026, assets/js/admin-emoji.js). */
.cb-emoji-champ { position: relative; display: block; }
.cb-emoji-champ > input { padding-right: 40px; }
.cb-emoji-champ > textarea { padding-right: 40px; }
.cb-emoji-btn { position: absolute; right: 6px; top: 6px; width: 30px; height: 30px; border: 0; border-radius: 8px; background: transparent; font-size: 1.05rem; line-height: 1; cursor: pointer; opacity: .7; transition: opacity .15s, background .15s; }
.cb-emoji-champ:not(.is-zone) .cb-emoji-btn { top: 50%; transform: translateY(-50%); }
.cb-emoji-btn:hover, .cb-emoji-btn:focus-visible { opacity: 1; background: #E9FBF8; }
.cb-emoji-pop { position: absolute; right: 0; top: calc(100% + 6px); z-index: 50; width: 300px; max-width: calc(100vw - 32px); max-height: 280px; overflow-y: auto; padding: 10px 12px; background: #fff; border: 1px solid rgba(35,48,72,.08); border-radius: 14px; box-shadow: 0 12px 32px rgba(35,48,72,.16); }
.cb-emoji-titre { margin: 6px 0 4px; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--slate); }
.cb-emoji-titre:first-child { margin-top: 0; }
.cb-emoji-grille { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 2px; }
.cb-emoji-grille button { border: 0; background: transparent; border-radius: 8px; font-size: 1.15rem; line-height: 1; padding: 6px 0; cursor: pointer; }
.cb-emoji-grille button:hover, .cb-emoji-grille button:focus-visible { background: #F8F6FE; }

/* Statut du lead modifiable depuis la fiche (06/10/2026) : pastille-menu. */
.cb-crm-statut-select { position: relative; display: inline-flex; align-items: center; cursor: pointer; padding-right: 22px; }
.cb-crm-statut-select::after { content: ""; position: absolute; right: 9px; top: 50%; width: 6px; height: 6px; border-right: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor; transform: translateY(-70%) rotate(45deg); pointer-events: none; }
.cb-crm-statut-select select { appearance: none; -webkit-appearance: none; border: 0; background: transparent; color: inherit; font: inherit; font-weight: inherit; padding: 0; margin: 0; cursor: pointer; outline: none; }
.cb-crm-statut-select:focus-within { box-shadow: 0 0 0 2px rgba(80,221,196,.45); }
/* Champ équipé du bouton emoji dans une rangée flex (formulaire de réponse du CRM…) : garde la largeur du champ. */
.cb-emoji-champ { flex: 1 1 auto; min-width: 0; width: 100%; }

/* Filtre par parcours du tableau Démarches (07/10/2026) */
.cb-crm-board-parcours { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -4px 0 14px; }
.cb-crm-board-parcours > span { font-size: 0.74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--slate); margin-right: 4px; }
.cb-crm-chip-n { display: inline-block; min-width: 18px; padding: 0 5px; margin-left: 4px; border-radius: 999px; background: rgba(35,48,72,0.08); font-size: 0.72rem; font-weight: 700; text-align: center; }
.cb-crm-chip.is-active .cb-crm-chip-n { background: rgba(255,255,255,0.6); }

/* Guides des démarches dans la fiche CRM (07/10/2026) */
.cb-crm-guides { list-style: none; margin: 0 0 10px; padding: 10px 12px; background: #F8F6FE; border-radius: 12px; display: grid; gap: 6px; font-size: .86rem; }
.cb-crm-guides li { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; justify-content: space-between; }
.cb-crm-guides a { color: var(--marine); font-weight: 600; }
.cb-crm-guide-vu { color: #137A68; }
.cb-crm-guides-choix { display: grid; gap: 8px; margin-bottom: 14px; max-height: 50vh; overflow-y: auto; }
.cb-crm-guide-choix { display: flex; gap: 10px; align-items: flex-start; border: 1.5px solid var(--border); border-radius: 12px; padding: 10px 12px; cursor: pointer; background: #fff; }
.cb-crm-guide-choix:has(input:checked) { border-color: #25BCA1; background: #E9FBF8; }
.cb-crm-guide-choix.is-autre { opacity: .8; }
.cb-crm-guide-choix > span { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; font-size: .88rem; }
.cb-crm-guide-choix small { color: var(--slate); font-size: .78rem; }
.cb-crm-guide-deja { color: #8A6508 !important; }
.cb-crm-guide-badge { align-self: flex-start; font-size: .7rem; font-weight: 700; border-radius: 999px; padding: 1px 8px; background: #25BCA1; color: #fff; }
.cb-crm-guide-badge.is-soft { background: #D3F7F0; color: #137A68; }
.cb-crm-guide-choix input { margin-top: 3px; }

/* Barre de mise en forme des réponses au client (08/10/2026) */
.cb-fmt { display: flex; align-items: center; gap: 2px; flex-wrap: wrap; padding: 4px; margin-bottom: 6px; background: rgba(35,48,72,0.04); border-radius: 10px; }
.cb-fmt button { width: 30px; height: 28px; border: 0; border-radius: 7px; background: transparent; color: var(--marine); font: inherit; font-size: 0.9rem; cursor: pointer; display: grid; place-content: center; }
.cb-fmt button:hover { background: #fff; box-shadow: 0 1px 2px rgba(35,48,72,0.12); }
.cb-fmt button svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.cb-fmt button svg circle { fill: currentColor; stroke: none; }
.cb-fmt-sep { width: 1px; height: 18px; background: rgba(35,48,72,0.15); margin: 0 4px; }
.cb-fmt-aide { margin-left: auto; padding-right: 6px; font-size: 0.7rem; color: var(--slate); }
@media (max-width: 600px) { .cb-fmt-aide { display: none; } }
/* Messages mis en forme (lib/message-format.php) */
.cb-crm-chat-bubble p { margin: 0 0 6px; } .cb-crm-chat-bubble p:last-child { margin-bottom: 0; }
.cb-crm-chat-bubble ul, .cb-crm-chat-bubble ol { margin: 4px 0 6px; padding-left: 20px; }
.cb-crm-chat-bubble a { color: inherit; text-decoration: underline; word-break: break-all; }

/* Fil d'une démarche : échanges client ↔ équipe et notes internes, réponse directe (08/10/2026) */
.cb-fil-flux { display: flex; flex-direction: column; gap: 8px; max-height: 420px; overflow-y: auto; padding: 4px 2px 8px; }
.cb-fil-msg { max-width: 82%; padding: 9px 12px; border-radius: 14px; font-size: 0.85rem; line-height: 1.45; }
.cb-fil-msg--client { align-self: flex-start; background: #F8F6FE; border-bottom-left-radius: 4px; }
.cb-fil-msg--equipe { align-self: flex-end; background: #E9FBF8; border-bottom-right-radius: 4px; }
.cb-fil-msg--interne { align-self: flex-end; background: #FFFBF2; border: 1px dashed rgba(224,161,0,0.45); border-bottom-right-radius: 4px; }
.cb-fil-meta { display: block; font-size: 0.7rem; color: var(--slate); margin-bottom: 3px; }
.cb-fil-meta b { color: #8A6508; }
.cb-fil-texte p { margin: 0 0 5px; } .cb-fil-texte p:last-child { margin-bottom: 0; }
.cb-fil-texte ul, .cb-fil-texte ol { margin: 3px 0 5px; padding-left: 18px; }
.cb-fil-texte a { color: inherit; text-decoration: underline; word-break: break-all; }
.cb-fil-form { margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--border); }
.cb-fil-form textarea { width: 100%; box-sizing: border-box; min-height: 80px; max-height: 50vh; padding: 10px 12px; border: 1.5px solid var(--border); border-radius: 10px; font: inherit; font-size: 0.88rem; line-height: 1.5; resize: vertical; }
.cb-fil-form textarea:focus { outline: none; border-color: #26BCA1; box-shadow: 0 0 0 3px rgba(80,221,196,0.18); }
.cb-fil-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: flex-end; margin-top: 8px; }
.cb-fil-actions .cb-crm-checkbox-inline { margin-right: auto; font-size: 0.78rem; }

/* Boutons « copier » email / téléphone (08/10/2026) */
.cb-contact-copie { display: inline-flex; align-items: center; gap: 2px; }
.cb-copier { display: inline-grid; place-content: center; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 7px; background: transparent; color: var(--slate); cursor: pointer; transition: background .15s, color .15s; }
.cb-copier:hover { background: rgba(35,48,72,0.07); color: var(--marine); }
.cb-copier svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.cb-copier.ok { background: #E6F8F3; color: #16715a; }

/* Sous-vues d'un onglet (CVthèque, 08/10/2026) : pastilles au lieu de liens « Aussi » */
.cb-sousnav { display: flex; flex-wrap: wrap; gap: 4px; margin: -4px 0 16px; padding: 4px; background: rgba(35,48,72,0.05); border-radius: 12px; width: fit-content; max-width: 100%; }
.cb-sousnav a { padding: 6px 12px; border-radius: 9px; font-size: 0.8rem; font-weight: 600; color: var(--slate); text-decoration: none; white-space: nowrap; }
.cb-sousnav a:hover { color: var(--marine); }
.cb-sousnav a.active { background: #fff; color: var(--marine); box-shadow: 0 1px 3px rgba(35,48,72,0.12); }
.cb-crm-menu-panel .cb-crm-date-pick { display: block; }
.cb-crm-menu-panel .cb-crm-date-pick button { width: 100%; }

/* Formulaire officiel dans la démarche (09/10/2026). */
.cb-fo-admin-corps { padding: 0 2px 12px; display: grid; gap: 10px; }
.cb-fo-admin-jalons { margin: 0; padding-left: 18px; font-size: .86rem; line-height: 1.6; }
.cb-fo-admin-points { margin: 0; padding: 10px 12px 10px 28px; background: #FFF7ED; border-radius: 10px; font-size: .84rem; }
.cb-fo-admin-points li.is-bloquant { color: #B42318; font-weight: 600; }
.cb-fo-admin-alerte { margin: 0; padding: 8px 12px; background: #FFF4E5; border-radius: 10px; font-size: .84rem; color: #9A3412; }
.cb-fo-admin-rep > summary { cursor: pointer; font-size: .85rem; font-weight: 700; color: var(--turquoise-dark, #13806D); }
.cb-fo-admin-rep table { margin-top: 6px; font-size: .84rem; }
.cb-fo-admin-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.cb-fo-admin-actions form { margin: 0; }
.cb-fo-admin-corriger { display: grid; gap: 6px; font-size: .84rem; }
.cb-fo-admin-corriger textarea { width: 100%; font: inherit; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--border, #e2e8f0); }
.cb-fo-admin-corriger button { justify-self: start; }

/* Non lu (09/10/2026) : tâche jamais ouverte ou remise « non lue ». */
.cb-crm-non-lu { display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 50%; background: #2E90FA; vertical-align: middle; box-shadow: 0 0 0 3px rgba(46,144,250,.18); }
.cb-crm-trow.is-non-lue .cb-crm-trow-title, .cb-crm-task.is-non-lue .cb-crm-task-title, .cb-home-tasks li.is-non-lue strong, li.is-non-lue .cb-home-task strong { font-weight: 800; }
.cb-crm-dm-summary .cb-crm-a-toi { color: #5022D3; font-weight: 700; }