/* =====================================================================
   CRM — v3 « Moteur d'action Ontario »
   Design tokens propres (--crm-*) dérivés du shell GANDALF : thème clair
   (signature Chanv crème) + sombre via body[data-gtheme="dark"].
   Tout est scopé .crm- ; aucune fuite vers le reste du hub.
   ===================================================================== */

#crm-view, #agriculture-view, .crm-sheet-ov {
  /* thème clair (défaut) */
  --crm-ground: transparent;
  --crm-card: #FFFFFF;
  --crm-card-2: #FAF6EC;
  --crm-line: rgba(40, 34, 24, .09);
  --crm-line-strong: rgba(40, 34, 24, .16);
  --crm-ink: #282521;
  --crm-ink-2: rgba(40, 38, 34, .62);
  --crm-ink-3: rgba(40, 38, 34, .42);
  --crm-accent: #A8863F;
  --crm-accent-ink: #FFFFFF;
  --crm-accent-soft: rgba(168, 134, 63, .10);
  --crm-shadow: 0 1px 2px rgba(40, 34, 24, .04), 0 8px 24px -12px rgba(40, 34, 24, .10);
  --crm-shadow-lift: 0 2px 4px rgba(40, 34, 24, .05), 0 16px 32px -16px rgba(40, 34, 24, .18);
  --crm-ok-ink: #256B43;      --crm-ok-bg: #E3F2E8;      --crm-ok-dot: #34A264;
  --crm-warn-ink: #8A5A12;    --crm-warn-bg: #F9EED9;    --crm-warn-dot: #D08A2A;
  --crm-crit-ink: #93443B;    --crm-crit-bg: #F7E9E6;    --crm-crit-dot: #C0574E;
  --crm-info-ink: #31518E;    --crm-info-bg: #E8EDF8;    --crm-info-dot: #4A76C4;
  --crm-chart-a: #B99653;     --crm-chart-b: #DDCBA4;
}
body[data-gtheme="dark"] #crm-view, body[data-gtheme="dark"] #agriculture-view, body[data-gtheme="dark"] .crm-sheet-ov {
  --crm-card: #2b2823;
  --crm-card-2: #332f28;
  --crm-line: rgba(221, 203, 164, .13);
  --crm-line-strong: rgba(221, 203, 164, .26);
  --crm-ink: rgba(255, 255, 255, .92);
  --crm-ink-2: rgba(255, 255, 255, .58);
  --crm-ink-3: rgba(255, 255, 255, .36);
  --crm-accent: #DDCBA4;
  --crm-accent-ink: #241f16;
  --crm-accent-soft: rgba(221, 203, 164, .12);
  --crm-shadow: 0 1px 2px rgba(0, 0, 0, .25), 0 10px 28px -14px rgba(0, 0, 0, .5);
  --crm-shadow-lift: 0 2px 6px rgba(0, 0, 0, .3), 0 18px 38px -16px rgba(0, 0, 0, .55);
  --crm-ok-ink: #96C7A8;      --crm-ok-bg: rgba(84, 160, 116, .16);   --crm-ok-dot: #64B586;
  --crm-warn-ink: #E5B573;    --crm-warn-bg: rgba(208, 138, 42, .15); --crm-warn-dot: #DA9A44;
  --crm-crit-ink: #DE9A90;    --crm-crit-bg: rgba(192, 87, 78, .16);  --crm-crit-dot: #CC6B5A;
  --crm-info-ink: #A3BCE8;    --crm-info-bg: rgba(74, 118, 196, .17); --crm-info-dot: #7B9BD6;
  --crm-chart-a: #DDCBA4;     --crm-chart-b: #8a7347;
}

.crm-list, .crm-fiche { max-width: 980px; margin: 0 auto; color: var(--crm-ink); }

/* --- Animations partagées ------------------------------------------- */
@keyframes crm-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes crm-sheet-up { from { opacity: .4; transform: translateY(36px); } to { opacity: 1; transform: none; } }
@keyframes crm-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes crm-shimmer { from { background-position: 140% 0; } to { background-position: -40% 0; } }
@keyframes crm-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(52, 162, 100, .45); } 60% { box-shadow: 0 0 0 5px rgba(52, 162, 100, 0); } }
@media (prefers-reduced-motion: reduce) {
  #crm-view *, #crm-view *::before, #crm-view *::after,
  .crm-sheet-ov, .crm-sheet { animation: none !important; transition: none !important; }
}

/* --- Squelettes de chargement --------------------------------------- */
.crm-skel { border-radius: 10px; background: linear-gradient(100deg, var(--crm-card-2) 40%, var(--crm-card) 50%, var(--crm-card-2) 60%) 0 0 / 200% 100%; animation: crm-shimmer 1.4s linear infinite; }
.crm-skel-row { display: flex; align-items: center; gap: 14px; padding: 14px 18px; }
.crm-skel-row + .crm-skel-row { border-top: 1px solid var(--crm-line); }
.crm-skel--av { width: 42px; height: 42px; border-radius: 13px; flex: none; }
.crm-skel--l1 { height: 13px; width: 46%; margin-bottom: 7px; }
.crm-skel--l2 { height: 11px; width: 28%; }
.crm-skel--pill { width: 74px; height: 24px; border-radius: 999px; margin-left: auto; flex: none; }

/* --- En-tête de la liste --------------------------------------------- */
.crm-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 16px; animation: crm-in .3s ease both; }
.crm-head__title { font-size: 24px; font-weight: 650; letter-spacing: -.02em; }
.crm-head__sub { font-size: 13px; color: var(--crm-ink-2); margin-top: 3px; }
.crm-head__new { display: inline-flex; align-items: center; gap: 7px; background: var(--crm-accent); color: var(--crm-accent-ink); border: none; border-radius: 12px; font: inherit; font-size: 13.5px; font-weight: 550; padding: 10px 16px; cursor: pointer; box-shadow: var(--crm-shadow); transition: transform .15s ease, box-shadow .15s ease, filter .15s ease; }
.crm-head__new:hover { transform: translateY(-1px); box-shadow: var(--crm-shadow-lift); filter: brightness(1.04); }
.crm-head__new:active { transform: none; }

/* KPI cliquables = filtres de statut */
.crm-kpis { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-bottom: 14px; }
.crm-kpi { position: relative; text-align: left; background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 16px; padding: 13px 16px 12px; cursor: pointer; font: inherit; color: inherit; box-shadow: var(--crm-shadow); transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease; animation: crm-in .34s ease both; }
.crm-kpi:nth-child(2) { animation-delay: .03s; } .crm-kpi:nth-child(3) { animation-delay: .06s; }
.crm-kpi:nth-child(4) { animation-delay: .09s; } .crm-kpi:nth-child(5) { animation-delay: .12s; }
.crm-kpi:hover { transform: translateY(-2px); box-shadow: var(--crm-shadow-lift); }
.crm-kpi:focus-visible { outline: 2px solid var(--crm-accent); outline-offset: 2px; }
.crm-kpi__n { font-size: 22px; font-weight: 650; letter-spacing: -.02em; line-height: 1.15; font-variant-numeric: tabular-nums; }
.crm-kpi__l { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--crm-ink-2); margin-top: 3px; }
.crm-kpi__dot { width: 7px; height: 7px; border-radius: 50%; flex: none; background: var(--crm-ink-3); }
.crm-kpi--actif .crm-kpi__dot { background: var(--crm-ok-dot); }
.crm-kpi--ralentit .crm-kpi__dot { background: var(--crm-warn-dot); }
.crm-kpi--dormant .crm-kpi__dot { background: var(--crm-crit-dot); }
.crm-kpi--prospect .crm-kpi__dot { background: var(--crm-info-dot); }
.crm-kpi.on { border-color: var(--crm-accent); box-shadow: 0 0 0 1px var(--crm-accent) inset, var(--crm-shadow); }
.crm-kpi.on::after { content: ''; position: absolute; inset: 0; border-radius: 16px; background: var(--crm-accent-soft); pointer-events: none; }

/* --- Barre d'outils --------------------------------------------------- */
.crm-toolbar { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 12px; animation: crm-in .38s ease both; }
.crm-search { flex: 1 1 240px; min-width: 170px; display: flex; align-items: center; gap: 9px; height: 42px; padding: 0 14px; background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 13px; transition: border-color .15s ease, box-shadow .15s ease; }
.crm-search:focus-within { border-color: var(--crm-accent); box-shadow: 0 0 0 3px var(--crm-accent-soft); }
.crm-search svg { color: var(--crm-ink-3); flex: none; }
.crm-search input { flex: 1; min-width: 0; border: none; outline: none; background: transparent; font: inherit; font-size: 14px; color: var(--crm-ink); }
.crm-search input::placeholder { color: var(--crm-ink-3); }
.crm-filter { height: 42px; padding: 0 34px 0 13px; border: 1px solid var(--crm-line); border-radius: 13px; font: inherit; font-size: 13px; background: var(--crm-card); color: var(--crm-ink); cursor: pointer; appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23968a70' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; transition: border-color .15s ease; }
.crm-filter:hover { border-color: var(--crm-line-strong); }
.crm-count { font-size: 12.5px; color: var(--crm-ink-3); margin: 2px 2px 8px; }

/* --- Table des magasins (desktop) / cards (mobile) -------------------- */
.crm-listwrap { background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 18px; overflow: hidden; box-shadow: var(--crm-shadow); animation: crm-in .42s ease both; }
.crm-thead { display: grid; grid-template-columns: 42px minmax(160px, 2fr) 76px minmax(78px, 1fr) minmax(78px, 1fr) 104px 96px 104px 100px; gap: 13px; align-items: center; padding: 10px 18px; background: var(--crm-card-2); border-bottom: 1px solid var(--crm-line); }
.crm-th { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--crm-ink-3); text-align: left; }
button.crm-th { background: none; border: none; padding: 0; cursor: pointer; font-family: inherit; display: inline-flex; align-items: center; gap: 4px; transition: color .12s ease; }
button.crm-th:hover { color: var(--crm-ink); }
button.crm-th.on { color: var(--crm-accent); }
.crm-th__arrow { font-size: 9px; line-height: 1; }
.crm-row { display: grid; grid-template-columns: 42px minmax(160px, 2fr) 76px minmax(78px, 1fr) minmax(78px, 1fr) 104px 96px 104px 100px; gap: 13px; align-items: center; padding: 11px 18px; cursor: pointer; transition: background .12s ease; }
.crm-row + .crm-row { border-top: 1px solid var(--crm-line); }
.crm-row:hover { background: var(--crm-accent-soft); }
.crm-row:focus-visible { outline: 2px solid var(--crm-accent); outline-offset: -2px; }
.crm-row__main { min-width: 0; }
.crm-row__name { font-weight: 550; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crm-row__sub, .crm-row__cell { color: var(--crm-ink-2); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crm-row__num { font-variant-numeric: tabular-nums; }
.crm-row__date { color: var(--crm-ink-2); font-size: 12.5px; white-space: nowrap; font-variant-numeric: tabular-nums; }

/* Cellule sell-through (part de marché + présence Bleuh) */
.crm-st-cell { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-variant-numeric: tabular-nums; }
.crm-st-cell--none { color: var(--crm-ink-3); }
.crm-st-dot { width: 7px; height: 7px; border-radius: 50%; flex: none; }
.crm-st-dot--ours { background: var(--crm-ok-dot); }
.crm-st-dot--zero { background: var(--crm-ink-3); opacity: .5; }
.crm-st-val { color: var(--crm-ink); }
.crm-st-cell .crm-st-opp { font-size: 12px; line-height: 1; }

/* Dernière activité : 2 lignes (date · heure + initiales) + pastille d'ancienneté */
.crm-lastact { display: inline-flex; flex-direction: column; gap: 1px; line-height: 1.25; font-variant-numeric: tabular-nums; }
.crm-lastact--none { color: var(--crm-ink-3); }
.crm-lastact__d { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.crm-lastact__t { font-size: 12px; color: var(--crm-ink-3); }
.crm-lastact__dot { width: 7px; height: 7px; border-radius: 50%; flex: none; }
.crm-lastact--fresh .crm-lastact__dot { background: var(--crm-ok-dot); }
.crm-lastact--ok .crm-lastact__dot { background: var(--crm-ok-dot); opacity: .55; }
.crm-lastact--warn .crm-lastact__dot { background: #e0a83c; }
.crm-lastact--cold .crm-lastact__dot { background: #d06b57; }
#crm-fixed-remove { padding: 6px 9px; color: var(--crm-ink-3); }

/* --- Monogramme ------------------------------------------------------- */
.crm-mono { width: 42px; height: 42px; border-radius: 13px; display: flex; align-items: center; justify-content: center; font-weight: 650; font-size: 13.5px; flex: none; letter-spacing: .01em; }
.crm-mono--lg { width: 58px; height: 58px; border-radius: 17px; font-size: 19px; }
.crm-mono--actif { background: var(--crm-ok-bg); color: var(--crm-ok-ink); }
.crm-mono--ralentit { background: var(--crm-warn-bg); color: var(--crm-warn-ink); }
.crm-mono--dormant { background: var(--crm-crit-bg); color: var(--crm-crit-ink); }
.crm-mono--prospect { background: var(--crm-info-bg); color: var(--crm-info-ink); }

/* --- Pastille de statut ------------------------------------------------ */
.crm-pill { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 550; padding: 4px 11px; border-radius: 999px; white-space: nowrap; justify-self: start; }
.crm-dot { width: 6px; height: 6px; border-radius: 50%; flex: none; }
.crm-pill--actif { background: var(--crm-ok-bg); color: var(--crm-ok-ink); } .crm-pill--actif .crm-dot { background: var(--crm-ok-dot); animation: crm-pulse 2.4s ease-out infinite; }
.crm-pill--ralentit { background: var(--crm-warn-bg); color: var(--crm-warn-ink); } .crm-pill--ralentit .crm-dot { background: var(--crm-warn-dot); }
.crm-pill--dormant { background: var(--crm-crit-bg); color: var(--crm-crit-ink); } .crm-pill--dormant .crm-dot { background: var(--crm-crit-dot); }
.crm-pill--prospect { background: var(--crm-info-bg); color: var(--crm-info-ink); } .crm-pill--prospect .crm-dot { background: var(--crm-info-dot); }

/* --- Pastille de segment ABCD -------------------------------------------- */
.crm-seg-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; font-size: 11px; font-weight: 650; border-radius: 999px; padding: 2px 8px; white-space: nowrap; letter-spacing: .02em; }
.crm-seg-badge--success { background: var(--crm-ok-bg); color: var(--crm-ok-ink); }
.crm-seg-badge--accent { background: var(--crm-accent-soft); color: var(--crm-accent); }
.crm-seg-badge--muted { background: var(--crm-card-2); color: var(--crm-ink-2); border: 1px solid var(--crm-line); }
.crm-seg-badge--warning { background: var(--crm-warn-bg); color: var(--crm-warn-ink); }
.crm-seg-badge--prospect { background: var(--crm-info-bg); color: var(--crm-info-ink); }

/* Filtre segments A/B/C/D/P (barre d'outils) */
.crm-segrow { display: inline-flex; gap: 2px; background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 13px; padding: 3px; height: 42px; box-sizing: border-box; align-items: stretch; }
.crm-segrow button { border: none; background: transparent; font: inherit; font-size: 12.5px; font-weight: 550; color: var(--crm-ink-2); padding: 0 12px; border-radius: 10px; cursor: pointer; transition: background .12s ease, color .12s ease; }
.crm-segrow button:hover { color: var(--crm-ink); }
.crm-segrow button.on { background: var(--crm-card); color: var(--crm-ink); box-shadow: var(--crm-shadow); }

/* --- États ------------------------------------------------------------- */
.crm-loading, .crm-empty, .crm-error { padding: 40px 24px; text-align: center; color: var(--crm-ink-2); animation: crm-fade .2s ease both; }
.crm-empty__ic { font-size: 26px; margin-bottom: 8px; opacity: .8; }
.crm-empty__hint { font-size: 12.5px; color: var(--crm-ink-3); margin-top: 4px; }
.crm-error { color: var(--crm-crit-ink); }

/* --- Fiche : hero ------------------------------------------------------- */
.crm-fiche__back { background: none; border: none; color: var(--crm-ink-2); font: inherit; font-size: 13.5px; cursor: pointer; padding: 6px 2px; margin-bottom: 10px; display: inline-flex; align-items: center; gap: 6px; border-radius: 8px; transition: color .12s ease; }
.crm-fiche__back:hover { color: var(--crm-ink); }
.crm-hero { position: relative; overflow: hidden; display: flex; align-items: center; gap: 16px; background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 20px; padding: 20px 22px; box-shadow: var(--crm-shadow); animation: crm-in .3s ease both; }
.crm-hero::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 3px; background: linear-gradient(90deg, var(--crm-chart-a), var(--crm-chart-b), transparent 85%); opacity: .9; }
.crm-hero__main { flex: 1; min-width: 0; }
.crm-hero__name { font-size: 19px; font-weight: 650; letter-spacing: -.015em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crm-hero__sub { font-size: 13px; color: var(--crm-ink-2); margin-top: 3px; }
.crm-hero__side { display: flex; align-items: center; gap: 10px; flex: none; }
.crm-hero__badges { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.crm-hero__seg { display: flex; align-items: center; gap: 8px; }
.crm-hero__score { font-size: 12px; color: var(--crm-ink-3); white-space: nowrap; font-variant-numeric: tabular-nums; }
.crm-hero__menu { position: relative; }
.crm-hero__more { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; background: none; border: 1px solid var(--crm-line); border-radius: 10px; color: var(--crm-ink-2); font-size: 17px; line-height: 1; cursor: pointer; transition: background .12s ease, color .12s ease; }
.crm-hero__more:hover { background: var(--crm-accent-soft); color: var(--crm-ink); }
.crm-hero__dropdown { display: none; position: absolute; right: 0; top: calc(100% + 6px); background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 12px; box-shadow: var(--crm-shadow-lift); min-width: 160px; z-index: 30; overflow: hidden; }
.crm-hero__dropdown.on { display: flex; flex-direction: column; animation: crm-in .14s ease both; }
.crm-hero__dropdown button { background: none; border: none; text-align: left; padding: 10px 14px; font: inherit; font-size: 13.5px; color: var(--crm-ink); cursor: pointer; }
.crm-hero__dropdown button:hover { background: var(--crm-accent-soft); }
.crm-hero__dropdown button.danger { color: var(--crm-crit-ink); }

/* Actions rapides */
.crm-actions { display: flex; gap: 8px; margin: 12px 0; animation: crm-in .34s ease both; }
.crm-action { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 7px; font: inherit; font-size: 13.5px; font-weight: 500; color: var(--crm-ink); text-decoration: none; padding: 11px; background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 13px; transition: transform .14s ease, box-shadow .14s ease, background .14s ease; cursor: pointer; }
.crm-action:hover { background: var(--crm-accent-soft); transform: translateY(-1px); box-shadow: var(--crm-shadow); }
.crm-action svg { color: var(--crm-ink-2); }

/* Bandeau KPI de la fiche */
.crm-fkpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 14px; animation: crm-in .38s ease both; }
.crm-fkpi { background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 15px; padding: 12px 15px; box-shadow: var(--crm-shadow); }
.crm-fkpi__n { font-size: 18px; font-weight: 650; letter-spacing: -.02em; font-variant-numeric: tabular-nums; line-height: 1.2; }
.crm-fkpi__l { font-size: 11.5px; color: var(--crm-ink-2); margin-top: 2px; }

/* --- Onglets de la fiche ------------------------------------------------ */
.crm-tabs { position: sticky; top: 0; z-index: 20; display: flex; gap: 2px; background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 14px; padding: 4px; margin-bottom: 14px; overflow-x: auto; scrollbar-width: none; animation: crm-in .42s ease both; }
.crm-tabs::-webkit-scrollbar { display: none; }
.crm-tab { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: none; background: transparent; font: inherit; font-size: 13.5px; font-weight: 500; color: var(--crm-ink-2); padding: 9px 14px; border-radius: 10px; cursor: pointer; white-space: nowrap; transition: background .14s ease, color .14s ease; }
.crm-tab:hover { color: var(--crm-ink); }
.crm-tab.on { background: var(--crm-card); color: var(--crm-ink); font-weight: 600; box-shadow: var(--crm-shadow); }
.crm-tab__badge { font-size: 11px; font-weight: 600; background: var(--crm-accent-soft); color: var(--crm-accent); border-radius: 999px; padding: 1px 7px; font-variant-numeric: tabular-nums; }
body[data-gtheme="dark"] #crm-view .crm-tab__badge { color: var(--crm-accent); }
.crm-tabpane { animation: crm-in .24s ease both; }

/* --- Cartes ------------------------------------------------------------- */
.crm-card { background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 18px; padding: 18px 20px; margin-bottom: 12px; box-shadow: var(--crm-shadow); }
.crm-section__label { font-size: 11px; color: var(--crm-ink-3); text-transform: uppercase; letter-spacing: .07em; font-weight: 600; margin-bottom: 12px; }
.crm-help-i { cursor: help; opacity: .5; font-weight: 700; text-transform: none; }
.crm-help-i:hover, .crm-help-i:focus { opacity: .9; outline: none; }

/* Coordonnées (aperçu) */
.crm-info { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 22px; }
.crm-info--dense { grid-template-columns: repeat(3, 1fr); gap: 9px 18px; }
.crm-info__item { min-width: 0; }
.crm-info__k { font-size: 11px; color: var(--crm-ink-3); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 2px; }
.crm-info__v { font-size: 14px; color: var(--crm-ink); overflow-wrap: anywhere; }
.crm-info__v a { color: inherit; text-decoration: none; border-bottom: 1px solid var(--crm-line-strong); transition: border-color .12s ease; }
.crm-info__v a:hover { border-color: var(--crm-accent); }
.crm-flags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.crm-flag { font-size: 11.5px; font-weight: 550; padding: 3px 10px; border-radius: 999px; background: var(--crm-accent-soft); color: var(--crm-accent); border: 1px solid transparent; }
body[data-gtheme="dark"] #crm-view .crm-flag { border-color: var(--crm-line); }

/* Top produits (aperçu) */
.crm-top { display: flex; flex-direction: column; gap: 9px; }
.crm-top__row { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; align-items: baseline; }
.crm-top__name { font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crm-top__city { color: var(--crm-ink-3); font-size: 12px; }
/* Format (« 3.5 g », « 5 × 0.5 g ») — la seule donnée qui distingue deux
   produits homonymes. Il est donc À CÔTÉ du nom, pas dans la ligne grise.
   Le modificateur reste LOCAL : .crm-top__name est partagé par 7 écrans. */
.crm-top__name--fmt { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 7px; min-width: 0; }
/* Priorité au NOM. Première tentative avec la pastille protégée : à 250 px le
   nom tombait à « O. », et sur une ligne il disparaissait complètement — on
   avait sauvé le complément en détruisant l'essentiel.
   Le plancher (min-width) empêche le nom de s'abréger au-delà du lisible ;
   quand la place manque vraiment, c'est la PASTILLE qui passe à la ligne. */
/* `flex: 0 1 auto` (et non 1 1) : le nom ne s'ÉTIRE pas, donc la pastille reste
   collée à lui. Étiré, le nom repoussait la pastille contre la colonne des
   unités, où elle se lisait comme un attribut du chiffre et non du produit. */
.crm-top__name--fmt .crm-top__nm { flex: 0 1 auto; min-width: 11ch;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crm-top__fmt { flex: none; font-size: 10.5px; font-weight: 600; letter-spacing: .01em;
    padding: 1.5px 6px; border-radius: 5px; white-space: nowrap;
    color: var(--crm-ink); background: var(--crm-card-2); border: 1px solid var(--crm-line); }
.crm-top__units { font-size: 12.5px; color: var(--crm-ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
/* Qualification du produit (sous-catégorie · catégorie · marque, + SKU quand
   le nom seul ne distingue plus). Discrète : elle départage, elle ne concurrence
   pas le nom. Sur toute la largeur, au-dessus de la barre. */
.crm-top__meta { grid-column: 1 / -1; font-size: 11.5px; color: var(--crm-ink-3, #9a927f);
    line-height: 1.35; margin-top: -1px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crm-top__bar { grid-column: 1 / -1; height: 5px; border-radius: 4px; background: var(--crm-card-2); overflow: hidden; }
.crm-top__bar > i { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, var(--crm-chart-a), var(--crm-chart-b)); }

/* --- Sell-through (marché) ------------------------------------------------ */
.crm-st-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 4px; }
.crm-st-kpi { background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 13px; padding: 12px 14px; }
.crm-st-kpi__n { font-size: 20px; font-weight: 650; letter-spacing: -.02em; font-variant-numeric: tabular-nums; line-height: 1.15; }
.crm-st-kpi__l { font-size: 11px; color: var(--crm-ink-2); margin-top: 3px; }
.crm-trend { font-size: 12px; margin-left: 2px; }
.crm-trend--up { color: var(--crm-ok-ink); } .crm-trend--down { color: var(--crm-crit-ink); } .crm-trend--flat { color: var(--crm-ink-3); }
.crm-insight { margin-top: 12px; font-size: 13px; line-height: 1.5; color: var(--crm-warn-ink); background: var(--crm-warn-bg); border-radius: 11px; padding: 10px 13px; }
.crm-st-legend { display: flex; gap: 16px; margin: 14px 0 2px; font-size: 11.5px; color: var(--crm-ink-2); }
.crm-st-legend span { display: inline-flex; align-items: center; gap: 6px; }
.crm-st-legend span::before { content: ''; width: 14px; height: 3px; border-radius: 2px; }
.crm-st-legend__cat::before { background: var(--crm-chart-b); opacity: .6; }
.crm-st-legend__ours::before { background: var(--crm-accent); }

/* --- Contacts ------------------------------------------------------------ */
.crm-contacts { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px; }
.crm-contact { display: flex; align-items: center; gap: 12px; background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 14px; padding: 12px 14px; transition: transform .14s ease, box-shadow .14s ease; }
.crm-contact:hover { transform: translateY(-1px); box-shadow: var(--crm-shadow); }
.crm-contact__av { width: 36px; height: 36px; border-radius: 50%; background: var(--crm-info-bg); color: var(--crm-info-ink); display: flex; align-items: center; justify-content: center; font-weight: 650; font-size: 13px; flex: none; }
.crm-contact__name { font-weight: 550; font-size: 14px; }
.crm-contact__role { font-size: 12px; color: var(--crm-ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crm-contact a { color: var(--crm-ink-2); display: inline-flex; padding: 5px; border-radius: 8px; transition: background .12s ease, color .12s ease; }
.crm-contact a:hover { background: var(--crm-accent-soft); color: var(--crm-ink); }
.crm-contact__edit, .crm-contact__del { background: none; border: none; color: var(--crm-ink-3); cursor: pointer; padding: 5px; border-radius: 8px; display: inline-flex; font-size: 13px; transition: background .12s ease, color .12s ease; }
.crm-contact__edit:hover { background: var(--crm-accent-soft); color: var(--crm-ink); }
.crm-contact__del:hover { background: var(--crm-crit-bg); color: var(--crm-crit-ink); }

/* --- Graphique hebdo (SVG) ------------------------------------------------ */
.crm-chart { margin: 2px 0 6px; }
.crm-chart svg { display: block; width: 100%; height: auto; }
.crm-chart .bar { transition: opacity .12s ease; }
.crm-chart .bar:hover { opacity: .75; }
.crm-chart .bar--peak { fill: var(--crm-accent); }
.crm-chart .bar--partial { fill-opacity: .38; stroke: var(--crm-ink-3); stroke-dasharray: 3 3; }
.crm-chart .lbl--partial { font-style: italic; opacity: .7; }
.crm-chart .grid { stroke: var(--crm-line); stroke-width: 1; }
.crm-chart .lbl { fill: var(--crm-ink-3); font-size: 9.5px; font-family: inherit; }
.crm-chart .val { fill: var(--crm-ink-2); font-size: 9.5px; font-weight: 600; font-family: inherit; }
/* Fiche : barres/dates cliquables → filtre les produits de la semaine */
#crm-fiche-orderchart .crm-chart .bar, #crm-fiche-orderchart .crm-chart .lbl, #crm-fiche-orderchart .crm-chart .val,
#crm-orders-chart .crm-chart .bar, #crm-orders-chart .crm-chart .lbl, #crm-orders-chart .crm-chart .val { cursor: pointer; }
.crm-chart .bar--sel { stroke: var(--crm-accent); stroke-width: 2.5; paint-order: stroke; }
.crm-chart-hint { font-size: 12px; color: var(--crm-ink-3); margin-top: 8px; }
.crm-week-clear { margin-left: 8px; font-size: 11px; font-weight: 600; color: var(--crm-accent); background: var(--crm-accent-soft); border: none; border-radius: 999px; padding: 2px 9px; cursor: pointer; vertical-align: middle; }
.crm-week-clear:hover { background: var(--crm-accent); color: var(--crm-accent-ink); }

/* Score : lignes cliquables + pop-up d'explication */
.crm-signal-hint { font-size: 11px; font-weight: 500; color: var(--crm-ink-3); text-transform: none; letter-spacing: 0; }
.crm-signal-row { cursor: pointer; border-radius: 8px; margin: 0 -6px; padding: 4px 6px; transition: background .12s ease; }
.crm-signal-row:hover { background: var(--crm-card-2); }
.crm-signal-row:focus-visible { outline: 2px solid var(--crm-accent); outline-offset: 1px; }
.crm-signal-i { font-size: 11px; color: var(--crm-ink-3); }
.crm-signal-row:hover .crm-signal-i { color: var(--crm-accent); }
.crm-explain-weight { font-size: 12.5px; color: var(--crm-ink-2); background: var(--crm-accent-soft); border-radius: 999px; padding: 4px 12px; display: inline-block; margin-bottom: 12px; }
.crm-explain-weight b { color: var(--crm-accent); }
.crm-explain-how { font-size: 14px; line-height: 1.55; color: var(--crm-ink); margin: 0 0 12px; }
.crm-explain-val { font-size: 13.5px; font-weight: 550; color: var(--crm-ink); background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 12px; padding: 11px 14px; }
.crm-explain-total { font-size: 12px; color: var(--crm-ink-3); margin-top: 14px; line-height: 1.5; }

/* --- Table des commandes --------------------------------------------------- */
.crm-table-scroll { overflow-x: auto; margin: 0 -20px; padding: 0 20px; }
.crm-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.crm-table th { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--crm-ink-3); text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--crm-line); white-space: nowrap; }
.crm-table th.num, .crm-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.crm-table td { padding: 9px 10px; border-bottom: 1px solid var(--crm-line); color: var(--crm-ink); }
.crm-table tr:last-child td { border-bottom: none; }
.crm-table tbody tr { transition: background .1s ease; }
.crm-table tbody tr:hover { background: var(--crm-accent-soft); }
.crm-table .dim { color: var(--crm-ink-2); font-size: 12.5px; white-space: nowrap; }
.crm-more { display: block; width: 100%; margin-top: 10px; background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 11px; font: inherit; font-size: 13px; font-weight: 500; color: var(--crm-ink-2); padding: 9px; cursor: pointer; transition: background .12s ease, color .12s ease; }
.crm-more:hover { background: var(--crm-accent-soft); color: var(--crm-ink); }

/* --- Activités : timeline --------------------------------------------------- */
.crm-act-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.crm-act-add { display: inline-flex; align-items: center; gap: 6px; background: var(--crm-accent); color: var(--crm-accent-ink); border: none; border-radius: 11px; font: inherit; font-size: 13px; font-weight: 550; padding: 8px 14px; cursor: pointer; box-shadow: var(--crm-shadow); transition: transform .14s ease, filter .14s ease; }
.crm-act-add:hover { transform: translateY(-1px); filter: brightness(1.05); }
.crm-tl__month { font-size: 11px; font-weight: 650; text-transform: uppercase; letter-spacing: .08em; color: var(--crm-ink-3); margin: 18px 0 10px 2px; }
.crm-tl__month:first-child { margin-top: 0; }
.crm-act { position: relative; display: flex; gap: 13px; padding: 2px 0 16px 0; }
.crm-act::before { content: ''; position: absolute; left: 17px; top: 40px; bottom: -2px; width: 2px; border-radius: 2px; background: var(--crm-line); }
.crm-act:last-child::before, .crm-act--last::before { display: none; }
.crm-act__ic { position: relative; z-index: 1; width: 36px; height: 36px; border-radius: 12px; display: flex; align-items: center; justify-content: center; flex: none; }
.crm-act__ic--accent { background: var(--crm-info-bg); color: var(--crm-info-ink); }
.crm-act__ic--success { background: var(--crm-ok-bg); color: var(--crm-ok-ink); }
.crm-act__ic--warning { background: var(--crm-warn-bg); color: var(--crm-warn-ink); }
.crm-act__ic--prospect { background: var(--crm-info-bg); color: var(--crm-info-ink); }
.crm-act__ic--muted { background: var(--crm-card-2); color: var(--crm-ink-2); border: 1px solid var(--crm-line); }
.crm-act__body { flex: 1; min-width: 0; background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 14px; padding: 11px 14px; }
.crm-act__top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.crm-act__type { font-weight: 600; font-size: 13.5px; }
.crm-act__when { font-size: 12px; color: var(--crm-ink-3); white-space: nowrap; font-variant-numeric: tabular-nums; }
.crm-act__src { font-size: 10.5px; font-weight: 650; color: var(--crm-ink-2); background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 999px; padding: 1px 8px; margin-left: 8px; margin-right: auto; letter-spacing: .03em; }
.crm-act__right { display: flex; align-items: center; gap: 4px; }
.crm-act__menu { position: relative; }
.crm-act__more { background: none; border: none; color: var(--crm-ink-3); cursor: pointer; font-size: 15px; line-height: 1; padding: 3px 7px; border-radius: 7px; transition: background .12s ease, color .12s ease; }
.crm-act__more:hover { background: var(--crm-accent-soft); color: var(--crm-ink); }
.crm-act__dropdown { display: none; position: absolute; right: 0; top: calc(100% + 4px); background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 11px; box-shadow: var(--crm-shadow-lift); min-width: 136px; z-index: 10; overflow: hidden; }
.crm-act__dropdown.on { display: flex; flex-direction: column; animation: crm-in .13s ease both; }
.crm-act__dropdown button { background: none; border: none; text-align: left; padding: 9px 13px; font: inherit; font-size: 13px; color: var(--crm-ink); cursor: pointer; width: 100%; }
.crm-act__dropdown button:hover { background: var(--crm-accent-soft); }
.crm-act__note { font-size: 13.5px; color: var(--crm-ink); opacity: .92; line-height: 1.55; margin-top: 5px; white-space: pre-wrap; overflow-wrap: anywhere; }
.crm-act__note--clamp { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.crm-act__expand { background: none; border: none; padding: 2px 0; margin-top: 2px; font: inherit; font-size: 12px; font-weight: 550; color: var(--crm-accent); cursor: pointer; }
.crm-act__photos { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 9px; }
.crm-act__photobtn { background: none; border: none; padding: 0; cursor: zoom-in; display: inline-flex; }
.crm-act__photo { width: 68px; height: 68px; object-fit: cover; border-radius: 10px; border: 1px solid var(--crm-line); transition: transform .14s ease; }
.crm-act__photo:hover { transform: scale(1.04); }
.crm-act__audio { width: 100%; max-width: 300px; height: 36px; margin-top: 9px; }
.crm-act__author { font-size: 11px; color: var(--crm-ink-3); margin-top: 7px; }

/* --- Feuille (bottom sheet / modale) ----------------------------------------- */
.crm-sheet-ov { position: fixed; inset: 0; background: rgba(24, 20, 14, .45); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); display: flex; align-items: flex-end; justify-content: center; z-index: 1000; animation: crm-fade .18s ease both; }
.crm-sheet { background: var(--crm-card, #FBF8F2); color: var(--crm-ink, #282521); width: 100%; max-width: 480px; border-radius: 22px 22px 0 0; max-height: 92dvh; overflow-y: auto; box-shadow: 0 -8px 40px rgba(0, 0, 0, .18); animation: crm-sheet-up .26s cubic-bezier(.32, .72, .33, 1) both; }
.crm-sheet::before { content: ''; display: block; width: 40px; height: 4px; border-radius: 999px; background: var(--crm-line, rgba(40,34,24,.14)); margin: 10px auto 0; }
@media (min-width: 560px) {
  .crm-sheet-ov { align-items: center; padding: 24px; }
  .crm-sheet { border-radius: 20px; }
  .crm-sheet::before { display: none; }
}
.crm-sheet__head { display: flex; align-items: center; justify-content: space-between; padding: 14px 20px; border-bottom: 1px solid var(--crm-line, rgba(40,34,24,.09)); font-weight: 600; font-size: 15px; position: sticky; top: 0; background: inherit; z-index: 2; }
.crm-sheet__x { background: none; border: none; font-size: 17px; cursor: pointer; color: var(--crm-ink-3, #9a927f); padding: 4px 8px; border-radius: 8px; transition: background .12s ease, color .12s ease; }
.crm-sheet__x:hover { background: var(--crm-accent-soft, rgba(168,134,63,.1)); color: var(--crm-ink, #282521); }
.crm-sheet__body { padding: 16px 20px calc(22px + env(safe-area-inset-bottom)); }
.crm-sheet__label { font-size: 11px; color: var(--crm-ink-3, #9a927f); text-transform: uppercase; letter-spacing: .06em; font-weight: 600; margin-bottom: 8px; }
.crm-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.crm-chips button { font: inherit; font-size: 13px; font-weight: 500; padding: 7px 14px; border-radius: 999px; border: 1px solid var(--crm-line, #ece4d6); background: var(--crm-card, #fff); color: var(--crm-ink-2, #6f6857); cursor: pointer; transition: all .13s ease; }
.crm-chips button:hover { border-color: var(--crm-line-strong, #d9cfba); }
.crm-chips button.on { background: var(--crm-accent, #A8863F); color: var(--crm-accent-ink, #fff); border-color: var(--crm-accent, #A8863F); }
.crm-sheet__note { width: 100%; border: 1px solid var(--crm-line, #ece4d6); border-radius: 13px; padding: 11px 13px; font-size: 14px; font-family: inherit; color: var(--crm-ink, #282521); background: var(--crm-card, #fff); resize: vertical; box-sizing: border-box; margin-bottom: 14px; transition: border-color .13s ease, box-shadow .13s ease; }
.crm-sheet__note:focus { outline: none; border-color: var(--crm-accent, #A8863F); box-shadow: 0 0 0 3px var(--crm-accent-soft, rgba(168,134,63,.1)); }
.crm-sheet__actions { display: flex; gap: 8px; margin-bottom: 12px; }
.crm-sheet__btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 7px; font: inherit; font-size: 13px; font-weight: 500; padding: 11px; border: 1px solid var(--crm-line, #ece4d6); border-radius: 12px; background: var(--crm-card, #fff); cursor: pointer; color: var(--crm-ink, #4a4438); transition: background .13s ease; }
.crm-sheet__btn:hover { background: var(--crm-accent-soft, rgba(168,134,63,.08)); }
.crm-sheet__thumbs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.crm-sheet__thumb { width: 58px; height: 58px; object-fit: cover; border-radius: 11px; border: 1px solid var(--crm-line, #efe9dd); }
.crm-rec { font-size: 13px; padding: 10px 13px; border-radius: 11px; background: var(--crm-info-bg, #eef1f8); color: var(--crm-info-ink, #2f4d86); margin-bottom: 12px; }
.crm-rec--live .crm-rec__dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--crm-crit-dot, #c0574e); margin-right: 6px; vertical-align: middle; animation: crm-pulse 1.4s ease-out infinite; }
.crm-rec--done { background: var(--crm-ok-bg, #e6f4ea); color: var(--crm-ok-ink, #1f6b3a); }
.crm-sheet__err { color: var(--crm-crit-ink, #8a3b34); font-size: 13px; margin-bottom: 10px; min-height: 4px; }
/* Indice desktop seulement (le collage n'existe pas vraiment sur mobile). */
.crm-sheet__hint { display: none; color: var(--crm-muted, #8a8577); font-size: 12px; margin: -2px 0 8px; }
@media (hover: hover) and (pointer: fine) { .crm-sheet__hint { display: block; } }
.crm-sheet__save { width: 100%; background: var(--crm-accent, #A8863F); color: var(--crm-accent-ink, #fff); border: none; border-radius: 13px; padding: 13px; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; transition: filter .13s ease, transform .13s ease; }
.crm-sheet__save:hover { filter: brightness(1.05); }
.crm-sheet__save:active { transform: scale(.99); }
.crm-sheet__save:disabled { opacity: .55; cursor: default; }

/* --- Formulaires (magasin / contact) ------------------------------------------ */
.crm-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
.crm-form-grid .crm-field--full { grid-column: 1 / -1; }
.crm-field { margin-bottom: 11px; }
.crm-field label { display: block; font-size: 12px; font-weight: 500; color: var(--crm-ink-2, #6f6857); margin-bottom: 4px; }
.crm-field input, .crm-field textarea { width: 100%; box-sizing: border-box; border: 1px solid var(--crm-line, #ece4d6); border-radius: 11px; padding: 9px 11px; font-size: 14px; font-family: inherit; color: var(--crm-ink, #282521); background: var(--crm-card, #fff); transition: border-color .13s ease, box-shadow .13s ease; }
.crm-field input:focus, .crm-field textarea:focus { outline: none; border-color: var(--crm-accent, #A8863F); box-shadow: 0 0 0 3px var(--crm-accent-soft, rgba(168,134,63,.1)); }

/* --- Confirmation --------------------------------------------------------------- */
.crm-confirm__msg { font-size: 14px; line-height: 1.55; margin-bottom: 16px; }
.crm-confirm__actions { display: flex; gap: 8px; }
.crm-confirm__actions .crm-sheet__save { width: auto; flex: 1; margin: 0; }
.crm-confirm__actions .crm-sheet__btn { flex: 1; }

/* --- Rapport hebdo ------------------------------------------------------------------ */
.crm-head__btns { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.crm-head__report { display: inline-flex; align-items: center; gap: 7px; background: var(--crm-card); color: var(--crm-ink); border: 1px solid var(--crm-line); border-radius: 12px; font: inherit; font-size: 13.5px; font-weight: 550; padding: 10px 16px; cursor: pointer; box-shadow: var(--crm-shadow); transition: transform .15s ease, box-shadow .15s ease, background .15s ease; }
.crm-head__report:hover { transform: translateY(-1px); box-shadow: var(--crm-shadow-lift); background: var(--crm-accent-soft); }
.crm-delta { font-size: 11px; font-weight: 600; border-radius: 999px; padding: 1px 7px; margin-left: 6px; white-space: nowrap; }
.crm-delta--up { background: var(--crm-ok-bg); color: var(--crm-ok-ink); }
.crm-delta--down { background: var(--crm-crit-bg); color: var(--crm-crit-ink); }
/* Synthèse markdown */
.crm-md__h { font-size: 13px; font-weight: 650; margin: 12px 0 6px; letter-spacing: -.01em; }
.crm-md__h:first-child { margin-top: 0; }
.crm-md__p { font-size: 13.5px; line-height: 1.6; margin: 0 0 8px; color: var(--crm-ink); opacity: .94; }
.crm-md__ul { margin: 0 0 8px; padding-left: 20px; }
.crm-md__ul li { font-size: 13.5px; line-height: 1.6; margin-bottom: 3px; }
/* Mouvements */
.crm-mv__group + .crm-mv__group { margin-top: 12px; }
.crm-mv__label { font-size: 11.5px; font-weight: 650; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 7px; }
.crm-mv__label--ok { color: var(--crm-ok-ink); } .crm-mv__label--crit { color: var(--crm-crit-ink); }
.crm-mv__label--accent { color: var(--crm-accent); } .crm-mv__label--warn { color: var(--crm-warn-ink); }
.crm-mv__pills { display: flex; flex-wrap: wrap; gap: 6px; }
.crm-mv__pill { display: inline-flex; align-items: center; gap: 7px; font: inherit; font-size: 12.5px; font-weight: 500; color: var(--crm-ink); background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 999px; padding: 5px 12px; cursor: pointer; transition: background .12s ease, transform .12s ease; }
.crm-mv__pill:hover { background: var(--crm-accent-soft); transform: translateY(-1px); }
.crm-mv__delta { font-size: 11px; color: var(--crm-ink-3); font-variant-numeric: tabular-nums; }
/* Priorités */
.crm-rep + .crm-rep { margin-top: 16px; }
.crm-rep__name { display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 650; margin-bottom: 10px; }
.crm-prio { background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 14px; padding: 12px 14px; margin-bottom: 10px; }
.crm-prio__head { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.crm-prio__name { background: none; border: none; padding: 0; font: inherit; font-size: 14px; font-weight: 600; color: var(--crm-ink); cursor: pointer; }
.crm-prio__name:hover { color: var(--crm-accent); }
.crm-prio__score { font-size: 11.5px; color: var(--crm-ink-3); font-variant-numeric: tabular-nums; }
.crm-prio__seen { font-size: 10.5px; font-weight: 600; color: var(--crm-ink-3); background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 999px; padding: 2px 8px; white-space: nowrap; }
.crm-prio__channel { margin-left: auto; font-size: 11.5px; font-weight: 600; color: var(--crm-accent); background: var(--crm-accent-soft); border-radius: 999px; padding: 3px 10px; white-space: nowrap; }
.crm-prio__why { font-size: 13px; color: var(--crm-ink-2); margin-top: 6px; line-height: 1.5; }
.crm-prio__how { font-size: 13px; font-weight: 550; margin-top: 4px; }
.crm-prio__warn { font-size: 12px; color: var(--crm-warn-ink); margin-top: 7px; }
/* Brouillon de courriel */
.crm-draft { margin-top: 10px; border-top: 1px dashed var(--crm-line); padding-top: 9px; }
.crm-draft__toggle { background: none; border: none; padding: 0; font: inherit; font-size: 12.5px; font-weight: 600; color: var(--crm-accent); cursor: pointer; }
.crm-draft__body { margin-top: 9px; background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 11px; padding: 11px 13px; }
.crm-draft__subject { font-size: 13px; font-weight: 650; margin-bottom: 6px; }
.crm-draft__text { font-size: 13px; line-height: 1.6; white-space: pre-wrap; color: var(--crm-ink); opacity: .92; }
.crm-draft__copy { margin-top: 9px; }

/* --- File d'approbation des courriels ---------------------------------------------- */
.crm-appr { padding: 14px 0; }
.crm-appr + .crm-appr { border-top: 1px solid var(--crm-line); margin-top: 6px; }
.crm-appr__head { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin-bottom: 10px; }
.crm-appr__store { background: none; border: none; padding: 0; font: inherit; font-size: 14px; font-weight: 650; color: var(--crm-ink); cursor: pointer; }
.crm-appr__store:hover { color: var(--crm-accent); }
.crm-appr__to { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; color: var(--crm-ink-2); }
.crm-appr__to svg { color: var(--crm-ink-3); }
.crm-appr__rep { font-size: 11.5px; color: var(--crm-ink-3); }
.crm-appr__status { margin-left: auto; font-size: 11px; font-weight: 650; border-radius: 999px; padding: 2px 9px; white-space: nowrap; }
.crm-appr__status--accent { background: var(--crm-accent-soft); color: var(--crm-accent); }
.crm-appr__status--ok { background: var(--crm-ok-bg); color: var(--crm-ok-ink); }
.crm-appr__status--crit { background: var(--crm-crit-bg); color: var(--crm-crit-ink); }
.crm-appr__status--muted { background: var(--crm-card-2); color: var(--crm-ink-2); border: 1px solid var(--crm-line); }
.crm-appr__subject { width: 100%; box-sizing: border-box; border: 1px solid var(--crm-line); border-radius: 11px; padding: 9px 12px; font: inherit; font-size: 13.5px; font-weight: 600; color: var(--crm-ink); background: var(--crm-card); margin-bottom: 8px; }
.crm-appr__body { width: 100%; box-sizing: border-box; border: 1px solid var(--crm-line); border-radius: 11px; padding: 10px 12px; font: inherit; font-size: 13.5px; line-height: 1.55; color: var(--crm-ink); background: var(--crm-card); resize: vertical; }
.crm-appr__subject:focus, .crm-appr__body:focus { outline: none; border-color: var(--crm-accent); box-shadow: 0 0 0 3px var(--crm-accent-soft); }
.crm-appr__subject:disabled, .crm-appr__body:disabled { background: var(--crm-card-2); color: var(--crm-ink-2); }
.crm-appr__actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 10px; }
.crm-appr__send { display: inline-flex; align-items: center; gap: 7px; background: var(--crm-accent); color: var(--crm-accent-ink); border: none; border-radius: 12px; font: inherit; font-size: 13.5px; font-weight: 600; padding: 10px 16px; cursor: pointer; transition: filter .13s ease, transform .13s ease; }
.crm-appr__send:hover { filter: brightness(1.05); } .crm-appr__send:active { transform: scale(.99); }
.crm-appr__send:disabled { opacity: .55; cursor: default; }
.crm-appr__err { margin-top: 9px; font-size: 12.5px; color: var(--crm-crit-ink); background: var(--crm-crit-bg); border-radius: 9px; padding: 8px 11px; }
.crm-appr__ok { margin-top: 9px; font-size: 13px; font-weight: 600; color: var(--crm-ok-ink); background: var(--crm-ok-bg); border-radius: 9px; padding: 8px 11px; }
.crm-appr__meta { font-size: 11.5px; color: var(--crm-ink-3); margin-top: 8px; }

/* --- Lightbox photo ---------------------------------------------------------------- */

/* --- Agriculture -------------------------------------------------------------------- */
.agri-late { font-style: italic; color: var(--crm-ink-2); opacity: .85; }

/* --- Divers ----------------------------------------------------------------------- */
.crm-soon { color: var(--crm-ink-3); font-size: 13px; padding: 6px 0; }

/* =====================================================================
   Responsive — mobile d'abord pour les reps sur la route
   ===================================================================== */
@media (max-width: 860px) {
  .crm-thead { display: none; }
  .crm-row { grid-template-columns: 42px 1fr auto; gap: 12px; padding: 12px 16px; }
  .crm-row__cell, .crm-row__num { display: none; }
  .crm-row__mob { display: block !important; }
  .crm-info { grid-template-columns: 1fr; }
}
@media (min-width: 861px) {
  .crm-row__mob { display: none !important; }
}
@media (max-width: 640px) {
  .crm-head__title { font-size: 21px; }
  .crm-kpis { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; margin: 0 -4px 12px; padding: 4px; }
  .crm-kpis::-webkit-scrollbar { display: none; }
  .crm-kpi { flex: 0 0 auto; min-width: 96px; padding: 11px 14px 10px; }
  .crm-kpi__n { font-size: 19px; }
  .crm-toolbar { gap: 6px; }
  .crm-filter { flex: 1; min-width: 0; }
  .crm-segrow { width: 100%; }
  .crm-segrow button { flex: 1; }
  .crm-hero { padding: 16px; gap: 13px; }
  .crm-hero__name { white-space: normal; font-size: 17px; }
  .crm-mono--lg { width: 50px; height: 50px; font-size: 16px; border-radius: 15px; }
  .crm-fkpis { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .crm-actions { flex-wrap: wrap; }
  .crm-action { flex: 1 1 40%; }
  .crm-card { padding: 15px 16px; border-radius: 16px; }
  .crm-table-scroll { margin: 0 -16px; padding: 0 16px; }
  .crm-table th.opt, .crm-table td.opt { display: none; }
  .crm-tab { padding: 9px 10px; font-size: 12.5px; }
  .crm-contacts { grid-template-columns: 1fr; }
  .crm-form-grid { grid-template-columns: 1fr; }
}

/* =====================================================================
   COCKPIT REP — accueil mobile-first (§ « Mon territoire »)
   ===================================================================== */
.crm-ck { max-width: 980px; margin: 0 auto; color: var(--crm-ink); }

/* Barre du haut : marque + sélecteur rep */
.crm-ck-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.crm-ck-brand { display: inline-flex; align-items: center; gap: 9px; }
.crm-ck-brand__ic { font-size: 22px; }
.crm-ck-brand__t { font-size: 20px; font-weight: 650; letter-spacing: -.02em; }
.crm-ck-top__r { display: flex; align-items: center; gap: 8px; }

/* Chips de navigation (défilement horizontal sur mobile) */
.crm-ck-chips { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; margin: 0 -4px 14px; padding: 2px 4px; }
.crm-ck-chips::-webkit-scrollbar { display: none; }
.crm-ck-chip { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 999px; font: inherit; font-size: 13px; font-weight: 550; color: var(--crm-ink); padding: 8px 14px; cursor: pointer; box-shadow: var(--crm-shadow); transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease; }
.crm-ck-chip:hover { transform: translateY(-1px); box-shadow: var(--crm-shadow-lift); border-color: var(--crm-line-strong); }

/* Héros : salutation + pouls du territoire */
.crm-ck-hero { background: linear-gradient(150deg, var(--crm-card) 60%, var(--crm-accent-soft)); border: 1px solid var(--crm-line); border-radius: 20px; padding: 18px 20px; box-shadow: var(--crm-shadow); margin-bottom: 14px; animation: crm-in .3s ease both; }
.crm-ck-hero__hi { font-size: 22px; font-weight: 680; letter-spacing: -.02em; }
.crm-ck-hero__sub { font-size: 13px; color: var(--crm-ink-2); margin-top: 4px; }
.crm-ck-segs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.crm-ck-seg { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; color: var(--crm-ink-2); font-variant-numeric: tabular-nums; }
.crm-ck-seg b { color: var(--crm-ink); font-weight: 650; }

/* Fraîcheur des données (sous les classes A/B/C/D/P).
   Discret par défaut : c'est un gage de confiance, pas une alerte. Il ne monte
   en visibilité que lorsqu'il a quelque chose à signaler — sinon il deviendrait
   du bruit qu'on cesse de lire, et il ne servirait plus le jour où ça casse. */
.crm-ck-fresh { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 10px; }
.crm-ck-fresh__i {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 12px; color: var(--crm-ink-3);
    cursor: pointer;   /* infobulle au survol, toast au toucher — le détail doit rester atteignable sur téléphone */
}
.crm-ck-fresh__i b { font-size: 9px; line-height: 1; }
.crm-ck-fresh__i--vieilli { color: var(--crm-warning, #a86b00); font-weight: 600; }
.crm-ck-fresh__i--echec { color: var(--crm-danger, #b42318); font-weight: 650; }
.crm-ck-fresh__i--inconnu { opacity: .65; font-style: italic; }

/* Recherche rapide (collante sous la barre) */
.crm-ck-search { position: sticky; top: 8px; z-index: 20; display: flex; align-items: center; gap: 9px; background: var(--crm-card); border: 1px solid var(--crm-line-strong); border-radius: 14px; padding: 0 14px; height: 48px; box-shadow: var(--crm-shadow); color: var(--crm-ink-3); margin-bottom: 6px; }
.crm-ck-search:focus-within { border-color: var(--crm-accent); }
.crm-ck-search input { flex: 1; min-width: 0; height: 100%; border: none; background: transparent; font: inherit; font-size: 15px; color: var(--crm-ink); outline: none; }
.crm-ck-results { background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 14px; box-shadow: var(--crm-shadow-lift); overflow: hidden; margin-bottom: 14px; }
.crm-ck-res { display: flex; align-items: center; gap: 6px; border-top: 1px solid var(--crm-line); }
.crm-ck-res:first-child { border-top: none; }
.crm-ck-res--none { padding: 14px; color: var(--crm-ink-3); font-size: 13px; }
.crm-ck-res__main { flex: 1; min-width: 0; display: flex; align-items: center; gap: 9px; background: none; border: none; font: inherit; color: var(--crm-ink); text-align: left; padding: 12px 14px; cursor: pointer; }
.crm-ck-res__main:hover { background: var(--crm-card-2); }
.crm-ck-res__name { font-size: 14px; font-weight: 550; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crm-ck-res__city { font-size: 12px; color: var(--crm-ink-3); margin-left: auto; white-space: nowrap; }
.crm-ck-res__add { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 40px; align-self: stretch; background: var(--crm-accent-soft); border: none; border-left: 1px solid var(--crm-line); color: var(--crm-accent); cursor: pointer; }
.crm-ck-res__add:hover { background: var(--crm-accent); color: var(--crm-accent-ink); }

/* KPI cliquables → liste filtrée */
.crm-ck-kpis { display: grid; grid-template-columns: repeat(6, 1fr); gap: 9px; margin-bottom: 16px; }
.crm-ck-kpi { text-align: left; background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 15px; padding: 13px 14px; cursor: pointer; font: inherit; color: inherit; box-shadow: var(--crm-shadow); transition: transform .15s ease, box-shadow .15s ease; }
.crm-ck-kpi:hover { transform: translateY(-2px); box-shadow: var(--crm-shadow-lift); }
.crm-ck-kpi__n { font-size: 22px; font-weight: 680; letter-spacing: -.02em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.crm-ck-kpi__l { font-size: 11.5px; color: var(--crm-ink-2); margin-top: 3px; }
.crm-ck-kpi--actif .crm-ck-kpi__n { color: var(--crm-ok-ink); }
.crm-ck-kpi--ralentit .crm-ck-kpi__n { color: var(--crm-warn-ink); }
.crm-ck-kpi--dormant .crm-ck-kpi__n { color: var(--crm-crit-ink); }
.crm-ck-kpi--prospect .crm-ck-kpi__n { color: var(--crm-ink-3); }
.crm-ck-kpi--opp .crm-ck-kpi__n { color: var(--crm-warn-ink); }

/* Sections */
.crm-ck-sec { margin-bottom: 18px; }
.crm-ck-sec__h { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 620; margin-bottom: 11px; }
.crm-ck-sec__badge { font-size: 11px; font-weight: 600; background: var(--crm-accent-soft); color: var(--crm-accent); border-radius: 999px; padding: 1px 8px; font-variant-numeric: tabular-nums; }

/* Cartes d'action */
.crm-ck-acts { display: grid; gap: 10px; }
.crm-ck-act { background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 15px; padding: 13px 15px; box-shadow: var(--crm-shadow); animation: crm-in .3s ease both; }
.crm-ck-act__head { display: flex; align-items: center; gap: 9px; }
.crm-ck-act__name { background: none; border: none; font: inherit; font-size: 14.5px; font-weight: 620; color: var(--crm-ink); cursor: pointer; padding: 0; text-align: left; }
.crm-ck-act__name:hover { color: var(--crm-accent); text-decoration: underline; }
.crm-ck-act__tag { margin-left: auto; font-size: 11px; color: var(--crm-ink-2); background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 999px; padding: 2px 9px; white-space: nowrap; }
.crm-ck-act__why { font-size: 13px; color: var(--crm-ink); margin-top: 7px; line-height: 1.45; }
.crm-ck-act__how { font-size: 12.5px; color: var(--crm-ink-2); margin-top: 3px; }
.crm-ck-act__warn { font-size: 12px; color: var(--crm-warn-ink); margin-top: 6px; }
.crm-ck-act__ctas { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 11px; }
.crm-ck-act__cta { display: inline-flex; align-items: center; gap: 6px; background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 10px; font: inherit; font-size: 12.5px; font-weight: 550; color: var(--crm-ink); padding: 8px 12px; cursor: pointer; text-decoration: none; transition: transform .14s ease, border-color .14s ease; }
.crm-ck-act__cta:hover { transform: translateY(-1px); border-color: var(--crm-line-strong); }
.crm-ck-act__cta--go { background: var(--crm-accent); color: var(--crm-accent-ink); border-color: transparent; }
.crm-ck-act__cta--go:hover { filter: brightness(1.05); }

/* Carte */
.crm-ck-maplegend { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 10px; font-size: 12px; color: var(--crm-ink-2); }
.crm-ck-maplegend span { display: inline-flex; align-items: center; gap: 5px; }
.crm-ck-maplegend i { width: 11px; height: 11px; border-radius: 50%; border: 1.5px solid #fff; box-shadow: 0 0 0 1px var(--crm-line-strong); }
.crm-ck-map { height: 320px; border-radius: 16px; overflow: hidden; border: 1px solid var(--crm-line); box-shadow: var(--crm-shadow); background: var(--crm-card-2); }
.crm-ck-map .leaflet-container { height: 100%; width: 100%; background: var(--crm-card-2); font: inherit; }
.crm-map__err { padding: 24px; text-align: center; color: var(--crm-ink-3); font-size: 13px; background: var(--crm-card-2); border-radius: 16px; }
.crm-map__clip { background: rgba(0,0,0,.62); color: #fff; font-size: 11px; padding: 3px 8px; border-radius: 8px; }

/* Popup de la carte */
.crm-mapp { min-width: 150px; }
.crm-mapp__seg { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; color: #fff; font-size: 11px; font-weight: 700; border-radius: 6px; padding: 0 6px; }
.crm-mapp__name { font-size: 14px; font-weight: 650; margin-top: 6px; color: #282521; }
.crm-mapp__city { font-size: 12px; color: #6b6355; }
.crm-mapp__btns { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.crm-mapp__btn, .crm-mapp__dir { display: inline-flex; align-items: center; gap: 4px; background: #A8863F; color: #fff; border: none; border-radius: 8px; font: inherit; font-size: 12px; font-weight: 550; padding: 6px 10px; cursor: pointer; text-decoration: none; }
.crm-mapp__btn--soft { background: #f0e9d8; color: #6b5320; }
/* Leaflet colore les <a> de popup en bleu (.leaflet-container a) : on reprend la main (spécificité classe+classe+élément). */
.crm-mapp a.crm-mapp__dir, .crm-mapp a.crm-mapp__dir:hover { color: #fff; text-decoration: none; }

/* Toast */
.crm-toast { position: fixed; left: 50%; bottom: 26px; transform: translate(-50%, 12px); background: var(--crm-ink); color: var(--crm-card); font-size: 13.5px; font-weight: 550; padding: 11px 18px; border-radius: 12px; box-shadow: var(--crm-shadow-lift); opacity: 0; z-index: 9999; transition: opacity .25s ease, transform .25s ease; pointer-events: none; }
.crm-toast.on { opacity: 1; transform: translate(-50%, 0); }

@media (min-width: 861px) {
  .crm-ck-map { height: 440px; }
}
@media (max-width: 640px) {
  .crm-ck-brand__t { font-size: 18px; }
  .crm-ck-hero { padding: 16px; border-radius: 18px; }
  .crm-ck-hero__hi { font-size: 20px; }
  .crm-ck-kpis { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .crm-ck-map { height: 280px; }
  .crm-ck-top__r .crm-filter { max-width: 190px; }
}

/* =====================================================================
   ADMIN REPS + ROUTES DE VISITE
   ===================================================================== */
/* — Champs de formulaire partagés (sheet large) — */
.crm-sheet--wide { max-width: 620px; }
.crm-fld { display: flex; flex-direction: column; gap: 4px; }
.crm-fld > span { font-size: 12px; color: var(--crm-ink-2); font-weight: 550; }
.crm-fld--wide { grid-column: 1 / -1; }
.crm-fld input { height: 42px; border: 1px solid var(--crm-line); border-radius: 11px; padding: 0 12px; font: inherit; font-size: 14px; color: var(--crm-ink); background: var(--crm-card); box-sizing: border-box; transition: border-color .13s ease; }
.crm-fld input:focus { outline: none; border-color: var(--crm-accent); }
.crm-check { display: flex; align-items: center; gap: 9px; font-size: 13.5px; color: var(--crm-ink); margin: 12px 0 2px; cursor: pointer; }
.crm-check input { width: 17px; height: 17px; accent-color: var(--crm-accent); }
.crm-rep-pinmap { height: 220px; border-radius: 14px; overflow: hidden; border: 1px solid var(--crm-line); margin-top: 10px; background: var(--crm-card-2); }
.crm-rep-pinmap .leaflet-container { height: 100%; width: 100%; font: inherit; }
.crm-mappin { background: none; border: none; font-size: 22px; line-height: 1; text-align: center; filter: drop-shadow(0 1px 2px rgba(0,0,0,.4)); }

/* — Cartes rep — */
.crm-rep-card { display: flex; align-items: center; gap: 14px; background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 15px; padding: 14px 16px; box-shadow: var(--crm-shadow); margin-bottom: 10px; animation: crm-in .3s ease both; }
.crm-rep-card__main { flex: 1; min-width: 0; }
.crm-rep-card__name { font-size: 15px; font-weight: 620; display: flex; align-items: center; gap: 8px; }
.crm-rep-card__off { font-size: 11px; font-weight: 550; color: var(--crm-ink-3); background: var(--crm-card-2); border-radius: 999px; padding: 1px 8px; }
.crm-rep-card__sub { font-size: 12.5px; color: var(--crm-ink-2); margin-top: 2px; }
.crm-rep-card__meta { font-size: 12px; color: var(--crm-ink-2); margin-top: 6px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.crm-rep-card__meta b { color: var(--crm-ink); }
.crm-rep-home { display: inline-flex; align-items: center; gap: 4px; font-weight: 550; border-radius: 999px; padding: 1px 8px; font-size: 11.5px; }
.crm-rep-home--ok { background: var(--crm-ok-bg); color: var(--crm-ok-ink); }
.crm-rep-home--no { background: var(--crm-warn-bg); color: var(--crm-warn-ink); }
.crm-rep-card__acts { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.crm-rep-btn { display: inline-flex; align-items: center; gap: 5px; background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 10px; font: inherit; font-size: 12.5px; font-weight: 550; color: var(--crm-ink); padding: 7px 11px; cursor: pointer; transition: transform .13s ease, border-color .13s ease; }
.crm-rep-btn:hover { transform: translateY(-1px); border-color: var(--crm-line-strong); }
.crm-rep-btn--go { background: var(--crm-accent); color: var(--crm-accent-ink); border-color: transparent; }
.crm-rep-btn--del { color: var(--crm-crit-ink); }

/* — Assignation par rayon — */
.crm-radius { background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 13px; padding: 12px 14px; margin-bottom: 12px; }
.crm-radius__label { font-size: 12.5px; font-weight: 600; color: var(--crm-ink); margin-bottom: 9px; }
.crm-radius__row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.crm-radius__row input[type="range"] { flex: 1; min-width: 140px; accent-color: var(--crm-accent); }
.crm-radius__km { font-size: 13px; color: var(--crm-ink-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.crm-radius__km b { color: var(--crm-ink); font-size: 15px; }
.crm-radius__count { font-size: 12.5px; font-weight: 600; color: var(--crm-accent); background: var(--crm-accent-soft); border-radius: 999px; padding: 3px 10px; white-space: nowrap; }
.crm-radius__opt { margin: 9px 0 0; font-size: 12.5px; }

/* — Assignation — */
.crm-assign-hint { font-size: 12px; color: var(--crm-ink-2); margin: 4px 0 8px; }
.crm-assign-list { display: flex; flex-direction: column; }
.crm-assign-row { display: flex; align-items: center; gap: 10px; padding: 10px 4px; border-top: 1px solid var(--crm-line); cursor: pointer; }
.crm-assign-row:first-child { border-top: none; }
.crm-assign-row input { width: 18px; height: 18px; accent-color: var(--crm-accent); flex: none; }
.crm-assign-row__name { flex: 1; min-width: 0; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crm-assign-row__city { font-size: 12px; color: var(--crm-ink-3); white-space: nowrap; }
.crm-assign-row__cur { font-size: 11px; color: var(--crm-warn-ink); background: var(--crm-warn-bg); border-radius: 999px; padding: 1px 7px; white-space: nowrap; }

/* — Planificateur de routes — */
.crm-rt-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 14px; }
.crm-rt-num { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--crm-ink-2); }
.crm-rt-num input { width: 56px; height: 40px; border: 1px solid var(--crm-line); border-radius: 10px; padding: 0 8px; font: inherit; font-size: 14px; color: var(--crm-ink); background: var(--crm-card); box-sizing: border-box; }
.crm-rt-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 14px; }
.crm-rt-map { height: 380px; border-radius: 16px; overflow: hidden; border: 1px solid var(--crm-line); box-shadow: var(--crm-shadow); background: var(--crm-card-2); margin-bottom: 16px; }
.crm-rt-map .leaflet-container { height: 100%; width: 100%; font: inherit; background: var(--crm-card-2); }
.crm-rt-tip { background: transparent !important; border: none !important; box-shadow: none !important; color: #fff; font-weight: 700; font-size: 11px; }
.crm-rt-warn { background: var(--crm-warn-bg); color: var(--crm-warn-ink); border-radius: 14px; padding: 16px 18px; font-size: 14px; line-height: 1.5; }
.crm-rt-days { display: grid; gap: 12px; }
.crm-rt-day { background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 15px; padding: 13px 15px; box-shadow: var(--crm-shadow); }
.crm-rt-day__h { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.crm-rt-day__dot { width: 12px; height: 12px; border-radius: 50%; flex: none; }
.crm-rt-day__meta { font-size: 12.5px; color: var(--crm-ink-2); }
.crm-rt-day__maps { margin-left: auto; font-size: 12.5px; font-weight: 550; color: var(--crm-accent); text-decoration: none; background: var(--crm-accent-soft); border-radius: 9px; padding: 5px 10px; }
.crm-rt-day__maps:hover { background: var(--crm-accent); color: var(--crm-accent-ink); }
.crm-rt-day__clip { font-size: 11px; color: var(--crm-warn-ink); background: var(--crm-warn-bg); border-radius: 999px; padding: 1px 8px; }

/* =====================================================================
   TABLEAU DE STATS
   ===================================================================== */
.crm-stats-controls { display: flex; gap: 8px; flex-wrap: wrap; }
.crm-stats-kpis { margin-bottom: 16px; }
.crm-fkpi--btn { cursor: pointer; text-align: left; font: inherit; color: inherit; transition: transform .14s ease, box-shadow .14s ease; }
.crm-fkpi--btn:hover { transform: translateY(-2px); box-shadow: var(--crm-shadow-lift); }
.crm-stats-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 4px; }
.crm-stats-toggle { flex: none; }
.crm-stats-hint { font-size: 12px; color: var(--crm-ink-3); margin: 6px 0 11px; }
.crm-stats-segs { display: flex; flex-direction: column; gap: 9px; }
.crm-stats-seg { display: flex; align-items: center; gap: 9px; font-size: 13px; }
.crm-stats-seg b { min-width: 34px; font-variant-numeric: tabular-nums; }
.crm-stats-seg__bar { flex: 1; height: 8px; border-radius: 5px; background: var(--crm-card-2); overflow: hidden; }
.crm-stats-seg__bar > i { display: block; height: 100%; border-radius: 5px; opacity: .85; }
.crm-stats-trow[data-rep] { cursor: pointer; }
.crm-stats-trow[data-rep]:hover { background: var(--crm-card-2); }
.crm-rt-stops { list-style: none; margin: 11px 0 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.crm-rt-stop { display: flex; align-items: center; gap: 9px; padding: 7px 4px; border-radius: 8px; cursor: pointer; }
.crm-rt-stop:hover { background: var(--crm-card-2); }
.crm-rt-stop__n { flex: none; width: 22px; height: 22px; border-radius: 50%; color: #fff; font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
/* Le nom est un <button> dans les deux modes (aperçu + figé) → reset de bouton ici. */
.crm-rt-stop__name { flex: 1; min-width: 0; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background: none; border: none; font-family: inherit; color: var(--crm-ink); cursor: pointer; text-align: left; padding: 0; }
.crm-rt-stop__name:hover { color: var(--crm-accent); }
.crm-rt-day__date { font-size: 12px; color: var(--crm-ink-2); font-weight: 500; }
.crm-rt-stop__info { flex: none; background: none; border: none; cursor: pointer; font-size: 12.5px; line-height: 1; padding: 3px 5px; border-radius: 6px; opacity: .55; }
.crm-rt-stop__info:hover { opacity: 1; background: var(--crm-card-2); }
.crm-rt-extra { margin-top: 16px; }

/* Routes figées : figer + progression + cases à cocher */
.crm-rt-freezebtn { display: inline-flex; align-items: center; gap: 8px; background: var(--crm-accent); color: var(--crm-accent-ink); border: none; border-radius: 12px; font: inherit; font-size: 14px; font-weight: 600; padding: 12px 18px; cursor: pointer; box-shadow: var(--crm-shadow); margin-bottom: 16px; width: 100%; justify-content: center; transition: filter .14s ease, transform .14s ease; }
.crm-rt-freezebtn:hover { filter: brightness(1.05); transform: translateY(-1px); }
.crm-rt-freeze { display: flex; align-items: center; gap: 12px; background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 14px; padding: 12px 16px; box-shadow: var(--crm-shadow); margin-bottom: 16px; }
.crm-rt-prog { flex: 1; min-width: 0; }
.crm-rt-prog__bar { height: 9px; border-radius: 6px; background: var(--crm-card-2); overflow: hidden; }
.crm-rt-prog__bar > i { display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg, var(--crm-ok-dot), var(--crm-accent)); transition: width .3s ease; }
.crm-rt-prog__lbl { display: inline-block; margin-top: 5px; font-size: 12.5px; font-weight: 550; color: var(--crm-ink-2); font-variant-numeric: tabular-nums; }
.crm-rt-regen { flex: none; background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 10px; font: inherit; font-size: 12.5px; font-weight: 550; color: var(--crm-ink); padding: 8px 12px; cursor: pointer; }
.crm-rt-regen:hover { border-color: var(--crm-line-strong); }
.crm-rt-stop--check { align-items: center; }
.crm-rt-check { display: inline-flex; align-items: center; cursor: pointer; position: relative; }
.crm-rt-check input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.crm-rt-checkbox { width: 21px; height: 21px; border: 2px solid var(--crm-line-strong); border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; flex: none; box-sizing: border-box; background: var(--crm-card); transition: background .12s, border-color .12s; }
.crm-rt-check:hover .crm-rt-checkbox { border-color: var(--crm-ok-dot); }
.crm-rt-check input:checked + .crm-rt-checkbox { background: var(--crm-ok-dot); border-color: var(--crm-ok-dot); }
.crm-rt-check input:checked + .crm-rt-checkbox::after { content: '✓'; color: #fff; font-size: 13px; font-weight: 800; line-height: 1; }
.crm-rt-stop--check.is-done .crm-rt-stop__name { text-decoration: line-through; color: var(--crm-ink-3); }
.crm-rt-stop--check.is-done { opacity: .72; }
.crm-rt-stop--check .crm-rt-stop__name { background: none; border: none; font: inherit; color: var(--crm-ink); cursor: pointer; text-align: left; padding: 0; }
.crm-rt-stop--check .crm-rt-stop__name:hover { color: var(--crm-accent); }

/* Figeage par jour + édition d'un jour figé (v2) */
.crm-rt-day.is-frozen { border-color: var(--crm-ok-dot); box-shadow: inset 3px 0 0 var(--crm-ok-dot), var(--crm-shadow); }
.crm-rt-lock { font-size: 12px; }
.crm-rt-daybtn { margin-left: 8px; flex: none; background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 9px; font: inherit; font-size: 12px; font-weight: 550; color: var(--crm-ink); padding: 5px 10px; cursor: pointer; }
.crm-rt-daybtn:hover { border-color: var(--crm-line-strong); }
.crm-rt-daybtn--freeze { background: var(--crm-accent-soft); color: var(--crm-accent); border-color: transparent; }
.crm-rt-daybtn--freeze.is-dirty { background: var(--crm-warn-bg); color: var(--crm-warn-ink); }
.crm-rt-dirty { font-size: 11px; color: var(--crm-warn-ink); background: var(--crm-warn-bg); border-radius: 999px; padding: 1px 8px; font-weight: 600; }
.crm-rt-drag { flex: none; cursor: grab; color: var(--crm-ink-3); font-size: 14px; line-height: 1; user-select: none; padding: 0 2px; }
.crm-rt-stop.is-dragging { opacity: .45; }
.crm-rt-stop--over { box-shadow: inset 0 2px 0 var(--crm-accent); }
.crm-rt-stop__rm { flex: none; background: none; border: none; cursor: pointer; font-size: 12px; color: var(--crm-ink-3); padding: 3px 5px; border-radius: 6px; }
.crm-rt-stop__rm:hover { color: var(--crm-danger-ink, #c0574e); background: var(--crm-card-2); }
.crm-rt-add { display: flex; gap: 7px; margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--crm-line); }
.crm-rt-add__in { flex: 1; min-width: 0; background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 9px; font: inherit; font-size: 13px; color: var(--crm-ink); padding: 7px 10px; }
.crm-rt-add__btn { flex: none; background: var(--crm-accent-soft); color: var(--crm-accent); border: none; border-radius: 9px; font: inherit; font-size: 13px; font-weight: 600; padding: 7px 13px; cursor: pointer; }
.crm-rt-add__btn:hover { background: var(--crm-accent); color: var(--crm-accent-ink); }
.crm-rt-freeze__hint { flex: 1; font-size: 12.5px; color: var(--crm-ink-2); }
.crm-rt-past { display: flex; align-items: center; gap: 8px; background: var(--crm-warn-bg); color: var(--crm-warn-ink); border-radius: 12px; padding: 9px 14px; font-size: 13px; font-weight: 550; margin-bottom: 14px; }
.crm-rt-hist { display: flex; flex-direction: column; gap: 8px; }
.crm-rt-hist__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 13px; padding: 13px 16px; cursor: pointer; font: inherit; text-align: left; box-shadow: var(--crm-shadow); }
.crm-rt-hist__row:hover { border-color: var(--crm-accent); }
.crm-rt-hist__wk { font-size: 14px; font-weight: 600; color: var(--crm-ink); }
.crm-rt-hist__meta { font-size: 12.5px; color: var(--crm-ink-2); }

@media (max-width: 640px) {
  .crm-rt-map { height: 300px; }
  .crm-rt-kpis { gap: 8px; }
  .crm-rep-card { flex-direction: column; align-items: stretch; gap: 10px; }
  .crm-rep-card__acts { justify-content: flex-start; }
  .crm-sheet--wide .crm-form-grid { grid-template-columns: 1fr; }
}

/* ═══════════ Suivi de classification (onglet + fiche) ═══════════ */
.crm-classif { display: flex; flex-direction: column; gap: 14px; padding: 0 clamp(18px, 2.5vw, 44px); box-sizing: border-box; }
.crm-classif-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.crm-classif-title { font-size: 1.15rem; font-weight: 800; color: var(--crm-ink); }
.crm-classif-sub { font-size: .85rem; color: var(--crm-ink-3); margin-top: -8px; }
.crm-classif-pers { display: inline-flex; gap: 6px; }
.crm-classif-per { border: 1px solid var(--crm-line); background: var(--crm-card); color: var(--crm-ink-2); border-radius: 999px; padding: 5px 11px; font-size: .78rem; font-weight: 700; cursor: pointer; }
.crm-classif-per.on { background: var(--crm-accent-soft); color: var(--crm-accent); border-color: transparent; }
.crm-classif-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.crm-classif-kpi { background: var(--crm-card); border: 1px solid var(--crm-line); border-radius: 14px; padding: 12px 14px; text-align: center; }
.crm-classif-kpi__n { font-size: 1.35rem; font-weight: 800; color: var(--crm-ink); font-variant-numeric: tabular-nums; }
.crm-classif-kpi__l { font-size: .72rem; color: var(--crm-ink-3); margin-top: 2px; text-transform: uppercase; letter-spacing: .04em; }
.crm-classif-kpi--up .crm-classif-kpi__n { color: var(--crm-ok-ink); }
.crm-classif-kpi--down .crm-classif-kpi__n { color: var(--crm-warn-ink); }
@media (max-width: 640px) { .crm-classif-kpis { grid-template-columns: repeat(2, 1fr); } }
.crm-classif-dist { display: flex; flex-direction: column; gap: 9px; }
.crm-classif-seg { display: flex; flex-direction: column; gap: 4px; }
.crm-classif-seg__head { display: flex; align-items: center; gap: 8px; font-size: .9rem; color: var(--crm-ink-2); }
.crm-classif-seg__head b { color: var(--crm-ink); }
.crm-classif-seg__pct { margin-left: auto; color: var(--crm-ink-3); font-variant-numeric: tabular-nums; }
.crm-classif-seg__bar { height: 8px; border-radius: 5px; background: var(--crm-card-2); overflow: hidden; }
.crm-classif-seg__bar > i { display: block; height: 100%; border-radius: 5px; opacity: .9; }
.crm-classif-legend { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 6px; font-size: .78rem; color: var(--crm-ink-3); }
.crm-classif-legend span { display: inline-flex; align-items: center; gap: 5px; }
.crm-classif-legend i { width: 12px; height: 3px; border-radius: 2px; display: inline-block; }
.crm-classif-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 720px) { .crm-classif-cols { grid-template-columns: 1fr; } }
.crm-hint { font-weight: 500; color: var(--crm-ink-3); font-size: .8em; }
/* Lignes de mouvement */
.crm-mv-list { display: flex; flex-direction: column; gap: 2px; }
.crm-mv { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; background: none; border: none; border-radius: 10px; padding: 8px 10px; cursor: pointer; color: var(--crm-ink); }
.crm-mv:hover { background: var(--crm-card-2); }
.crm-mv__segs { display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto; }
.crm-mv__arr { font-weight: 800; }
.crm-mv__arr--up { color: var(--crm-ok-ink); }
.crm-mv__arr--down { color: var(--crm-warn-ink); }
.crm-mv__arr--set { color: var(--crm-ink-3); }
.crm-mv__name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .9rem; }
.crm-mv__date { flex: 0 0 auto; font-size: .76rem; color: var(--crm-ink-3); font-variant-numeric: tabular-nums; }
/* Timeline fiche */
.crm-timeline { display: flex; flex-direction: column; gap: 2px; }
.crm-tl-row { display: flex; gap: 10px; padding: 8px 4px; border-bottom: 1px solid var(--crm-line); }
.crm-tl-row:last-child { border-bottom: none; }
.crm-tl-ic { flex: 0 0 auto; font-size: 1rem; line-height: 1.4; }
.crm-tl-main { min-width: 0; }
.crm-tl-t { font-size: .9rem; color: var(--crm-ink); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.crm-tl-meta { font-size: .76rem; color: var(--crm-ink-3); margin-top: 2px; }
/* Légende carte = filtre par classe (boutons cliquables) */
.crm-ck-legbtn { display: inline-flex; align-items: center; gap: 5px; background: none; border: 1px solid transparent; border-radius: 999px; padding: 3px 9px; cursor: pointer; color: var(--crm-ink-2); font-size: .8rem; font-weight: 600; }
.crm-ck-legbtn i { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.crm-ck-legbtn:hover { background: var(--crm-card-2); }
.crm-ck-legbtn.off { opacity: .38; }
.crm-ck-legbtn.off i { filter: grayscale(1); }

/* --- Agriculture --------------------------------------------------------- */
#agriculture-view { color: var(--crm-ink); }
#agriculture-view > * { max-width: 980px; margin-left: auto; margin-right: auto; }
.crm-cockpit { display: flex; flex-direction: column; gap: 12px; animation: crm-in .3s ease both; }
/* Ligne simple champ/section (≠ .crm-row, la grille 8 colonnes de la table clients CRM) */
.agri-row { display: flex; align-items: center; gap: 10px; width: 100%; background: none; border: none; border-top: 1px solid var(--crm-line); font: inherit; color: var(--crm-ink); text-align: left; padding: 12px 4px; cursor: pointer; border-radius: 0; }
.agri-row:first-child { border-top: none; }
.agri-row:hover { background: var(--crm-card-2); }
.agri-row b { font-size: 14.5px; font-weight: 620; white-space: nowrap; }
.agri-row span { font-size: 12.5px; color: var(--crm-ink-2); margin-left: auto; text-align: right; }
/* ── Agriculture : tâches terrain ── */
.agri-task { display: flex; align-items: center; gap: 10px; padding: 10px 4px; border-top: 1px solid var(--crm-line); }
.agri-task:first-of-type { border-top: none; }
.agri-task__main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.agri-task__main b { font-size: 14.5px; font-weight: 620; }
.agri-task__detail { font-size: 12.5px; color: var(--crm-ink-2); }
.agri-task__meta { font-size: 11.5px; color: var(--crm-ink-2); opacity: 0.8; }
.agri-task__done { margin-left: auto; flex-shrink: 0; font: inherit; font-size: 13px; padding: 8px 12px; border-radius: 10px; border: 1px solid var(--crm-line); background: var(--crm-card-2); color: var(--crm-ink); cursor: pointer; }
.agri-task__add { font: inherit; font-size: 12.5px; padding: 4px 10px; border-radius: 8px; border: 1px solid var(--crm-line); background: none; color: var(--crm-ink); cursor: pointer; float: right; }
.agri-act__task { font-size: 12.5px; color: var(--crm-ink-2); margin: 2px 0; }
.agri-log__row { display: flex; align-items: baseline; gap: 8px; padding: 8px 4px; border-top: 1px solid var(--crm-line); font-size: 13px; flex-wrap: wrap; }
.agri-log__row:first-of-type { border-top: none; }
.agri-log__when { color: var(--crm-ink-2); font-size: 12px; white-space: nowrap; }
.agri-log__what { min-width: 0; }
.agri-log__by { margin-left: auto; color: var(--crm-ink-2); font-size: 12px; }
.agri-log__more { display: block; margin: 10px auto 0; font: inherit; font-size: 13px; padding: 8px 14px; border-radius: 10px; border: 1px solid var(--crm-line); background: var(--crm-card-2); color: var(--crm-ink); cursor: pointer; }
.agri-row--task b { color: var(--crm-ink); }
.agri-hello { display: flex; align-items: center; gap: 12px; }
.agri-weather { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--crm-ink-2); margin-top: 4px; }
/* Modal « Nouvelle activité » — vignette photo avec bouton de suppression (crm-sheet__thumb seul n'a pas ce besoin côté CRM). */
.agri-thumb { position: relative; display: inline-block; line-height: 0; }
.agri-thumb__rm { position: absolute; top: -6px; right: -6px; width: 20px; height: 20px; border-radius: 50%; border: none; background: var(--crm-crit-ink, #8a3b34); color: #fff; font-size: 11px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; }
/* ── Agriculture V1.1 : onglets cockpit/fiche ── */
.agri-tabs { margin: 10px 0; }
.agri-tabs .crm-ck-chip.on { background: var(--crm-ink); color: var(--crm-card, #fff); border-color: var(--crm-ink); }
.agri-map { height: min(70vh, 520px); border-radius: 12px; overflow: hidden; }
.agri-sec-label { background: rgba(255,255,255,.85); border: none; box-shadow: none; font-size: 11px; font-weight: 650; color: #2b2b2b; padding: 1px 4px; border-radius: 4px; }
.agri-act__zone { background: var(--crm-card-2); border: 1px solid var(--crm-line); border-radius: 999px; font: inherit; font-size: 11.5px; font-weight: 620; color: var(--crm-ink); padding: 2px 8px; cursor: pointer; white-space: nowrap; }
.agri-act__zone:hover { border-color: var(--crm-ink); }
.agri-fiche-chips { margin: 10px 0 4px; }
.agri-apercu div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 4px; border-top: 1px solid var(--crm-line); }
.agri-apercu div:first-child { border-top: none; }
.agri-apercu b { font-size: 13px; font-weight: 620; }
.agri-apercu span { font-size: 13px; color: var(--crm-ink-2); text-align: right; }
/* Graphique météo 24 h (bandeau « Bon matin ») — couleurs validées skill dataviz (palette catégorielle, checks CVD/contraste OK light+dark) */
.agri-wx-chart { width: 100%; height: 64px; margin-top: 8px; display: block; --agri-temp: #eb6834; --agri-rain: #2a78d6; }
body[data-gtheme="dark"] .agri-wx-chart { --agri-temp: #d95926; --agri-rain: #3987e5; }

/* Fournisseurs (lot 1 : consultation du référentiel FormAchat) */
.crm-sup-notes { margin-top: 6px; font-size: 12.5px; color: var(--crm-ink-3); white-space: pre-wrap; }
/* Provenance des données : le dire évite de croire que l'information manque
   alors qu'elle se saisit simplement ailleurs. */
.crm-sup-src { margin-top: 16px; font-size: 12px; color: var(--crm-ink-3); font-style: italic; line-height: 1.5; }

/* Fournisseurs — lot 2 : profil d'enrichissement */
.crm-sup-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
.crm-sup-tag {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 11.5px; font-weight: 550; padding: 3px 8px; border-radius: 999px;
    background: var(--crm-accent-soft, rgba(168,134,63,.1)); color: var(--crm-ink-2, #6b6455);
    white-space: nowrap;
}
.crm-sup-card--off { opacity: .55; }
/* Case à cocher « Fournisseur actif ».
   Deux règles GLOBALES du hub s'appliquaient ici et cassaient la rangée :
   `input { width:100% }` étirait la case sur toute la largeur en repoussant le
   texte à droite (même piège que le <select> à 872 px des grandeurs
   d'uniforme), et `label { text-transform:uppercase; font-weight:700 }` mettait
   l'intitulé en capitales comme un titre de champ — alors que c'est une phrase
   qu'on lit, pas une étiquette. On les neutralise explicitement. */
.crm-sup-check { display: flex; align-items: center; gap: 9px; font-size: 14px;
    margin: 4px 0 16px; cursor: pointer;
    text-transform: none; font-weight: 500; color: var(--crm-ink, #4a4438); letter-spacing: 0; }
.crm-sup-check input[type="checkbox"] {
    width: 17px; height: 17px; min-width: 17px; margin: 0; padding: 0;
    flex: 0 0 auto; accent-color: var(--crm-accent, #A8863F); cursor: pointer;
}
.crm-field__hint { font-size: 11.5px; color: var(--crm-ink-3, #9a927f); margin-top: 4px; line-height: 1.4; }
/* Profil dont le fournisseur a disparu côté FormAchat (suppression définitive,
   sans journal) : c'est le seul indice qu'une fiche a été détruite. */
.crm-sup-orph {
    margin-top: 14px; padding: 10px 13px; border-radius: 12px; font-size: 12.5px; line-height: 1.5;
    background: var(--crm-warning-soft, rgba(200,140,0,.09)); color: var(--crm-warning, #a86b00);
}

/* Fiche fournisseur — contacts, fermetures, hausses de prix */
.crm-sup-open { background: none; border: none; padding: 0; font: inherit; color: inherit; cursor: pointer; text-align: left; }
.crm-sup-open:hover { text-decoration: underline; }
.crm-sup-contact { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--crm-line, #ece4d6); }
.crm-sup-contact:last-of-type { border-bottom: 0; }
.crm-sup-contact__n { font-size: 14px; font-weight: 600; display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.crm-sup-contact__c { font-size: 12.5px; color: var(--crm-ink-2, #6b6455); margin-top: 2px; }
.crm-sup-vac { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 7px 0; font-size: 13.5px; border-bottom: 1px solid var(--crm-line, #ece4d6); }
.crm-sup-vac:last-of-type { border-bottom: 0; }
.crm-sup-tag--warn { background: var(--crm-warning-soft, rgba(200,140,0,.14)); color: var(--crm-warning, #a86b00); }
/* La « séquence » : la lecture qui transforme un journal en information. */
.crm-sup-seq { margin: 8px 0 12px; padding: 10px 13px; border-radius: 12px; font-size: 13px; line-height: 1.5; background: var(--crm-accent-soft, rgba(168,134,63,.1)); }
.crm-sup-seq--thin { background: none; padding: 4px 0; color: var(--crm-ink-3, #9a927f); font-style: italic; }
.crm-sup-price { display: grid; grid-template-columns: minmax(90px, auto) minmax(64px, auto) 1fr; gap: 10px; align-items: baseline; padding: 8px 0; border-bottom: 1px solid var(--crm-line, #ece4d6); font-size: 13.5px; }
.crm-sup-price:last-of-type { border-bottom: 0; }
.crm-sup-price__d { color: var(--crm-ink-2, #6b6455); font-variant-numeric: tabular-nums; }
.crm-sup-price__p { font-weight: 650; font-variant-numeric: tabular-nums; }
.crm-sup-price__nopct { font-weight: 400; font-style: italic; color: var(--crm-ink-3, #9a927f); }
.crm-sup-price__m { color: var(--crm-ink-2, #6b6455); min-width: 0; }
@media (max-width: 560px) { .crm-sup-price { grid-template-columns: 1fr auto; } .crm-sup-price__m { grid-column: 1 / -1; } }