/* ===========================================================
   CENTRE DE DISPATCH — board Espace Pro (desktop uniquement)
   v2 — direction "salle de contrôle premium" :
     · base neutre quasi-noire / blanc cassé
     · VERT (#00A86B) réservé EXCLUSIVEMENT aux actions
     · statut porté par filet + badge + point (plus d'aplats)
     · chiffres tabular, ombres douces, densité maîtrisée
   Affiché seulement avec body.dpro-ws-pro ; remplace .dpro-content.
   Tout est scopé .dpc-* / body.dpro-ws-pro -> zéro impact mobile/perso.
   =========================================================== */

/* ── Tokens locaux ── */
:root {
  --dpc-ink:#0F172A;   --dpc-text:#1F2937;  --dpc-muted:#64748B;  --dpc-faint:#94A3B8;
  --dpc-bg:#F6F8FB;    --dpc-surface:#FFFFFF; --dpc-hover:#F8FAFC; --dpc-line:#E9EDF2;
  --dpc-green:#00A86B; --dpc-green-h:#019760; --dpc-ring:rgba(0,168,107,.32);
  /* Statuts : badges / points / filets UNIQUEMENT (jamais en aplat plein) */
  --dpc-urgent:#DC2626;  --dpc-urgent-bg:#FEF2F2;
  --dpc-todo:#D97706;    --dpc-todo-bg:#FEF3E2;
  --dpc-active:#2563EB;  --dpc-active-bg:#EFF4FF;
  --dpc-assigned:#6366F1;--dpc-assigned-bg:#EEF0FF;
  --dpc-done:#94A3B8;    --dpc-done-bg:#F1F5F9;
  --dpc-e1:0 1px 3px rgba(16,24,40,.05);
  --dpc-e2:0 4px 16px rgba(16,24,40,.07);
}

.dpc-board { display: none; }
body.dpro-ws-pro .dpro-content { display: none !important; }

/* ── Topbar fusionnée : éléments visibles seulement en Espace Pro ── */
.dpc-topbar-title, .dpc-dispatch-btn { display: none; }
body.dpro-ws-pro .dpc-topbar-title { display: flex; align-items: center; font-size: 18px; font-weight: 800;
  color: var(--dpc-ink); white-space: nowrap; margin-right: 4px; }
body.dpro-ws-pro .dpc-dispatch-btn { display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 16px;
  border: none; border-radius: 11px; background: var(--dpc-green); color: #fff; font-size: 14px; font-weight: 700;
  cursor: pointer; box-shadow: 0 4px 14px rgba(0,168,107,.28); transition: background .15s; }
body.dpro-ws-pro .dpc-dispatch-btn:hover { background: var(--dpc-green-h); }

body.dpro-ws-pro .dpc-board {
  display: flex; flex-direction: column; gap: 14px;
  padding: 16px 20px; overflow: hidden; flex: 1; min-height: 0;
  background: var(--dpc-bg);
}

/* La carte devient panneau d'appoint : la liste gagne de la place */
.dpc-cols { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(360px,1fr); gap: 16px; flex: 1; min-height: 0; }
.dpc-left  { display: flex; flex-direction: column; gap: 12px; min-height: 0; overflow: hidden; padding: 2px 4px 0 4px; }
.dpc-right { display: flex; flex-direction: column; min-height: 0; }

/* Toolbar (conservé pour compat) */
.dpc-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; flex-shrink: 0; }
.dpc-title { font-size: 20px; font-weight: 800; color: var(--dpc-ink); }
.dpc-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.dpc-chip { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 12px;
  border: 1px solid var(--dpc-line); border-radius: 10px; background: #fff; font-size: 13px; font-weight: 600;
  color: #334155; cursor: pointer; }
.dpc-chip:hover { background: var(--dpc-hover); }
.dpc-datenav { width: 34px; height: 34px; border: 1px solid var(--dpc-line); border-radius: 9px; background: #fff;
  cursor: pointer; color: #475569; font-size: 16px; }

/* ── KPIs premium : chiffre dominant + label dessous + icône monochrome ── */
.dpc-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; flex-shrink: 0; }
.dpc-kpi { display: flex; align-items: flex-start; gap: 12px; background: var(--dpc-surface);
  border: 1px solid var(--dpc-line); border-radius: 14px; padding: 14px 16px; box-shadow: var(--dpc-e1); }
.dpc-kpi-ic { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; flex-shrink: 0;
  background: #F1F5F9; }
.dpc-kpi-ic svg { stroke: var(--dpc-muted); }            /* icônes monochromes par défaut */
.dpc-kpi > div { display: flex; flex-direction: column; min-width: 0; }
.dpc-kpi-num { font-size: 26px; font-weight: 800; color: var(--dpc-ink); line-height: 1.05;
  font-variant-numeric: tabular-nums; letter-spacing: -.5px; }
.dpc-kpi-lbl { font-size: 11px; color: var(--dpc-muted); font-weight: 700; display: block; margin: 3px 0 0;
  text-transform: uppercase; letter-spacing: .4px; }
.dpc-kpi-up  { font-size: 11px; font-weight: 700; display: inline-block; margin-top: 5px; color: var(--dpc-muted); }
/* Seule la métrique actionnable "À attribuer" garde un accent (ambre) */
.dpc-kpi.k-orange .dpc-kpi-ic { background: var(--dpc-todo-bg); }
.dpc-kpi.k-orange .dpc-kpi-ic svg { stroke: var(--dpc-todo); }
.dpc-kpi.k-orange .dpc-kpi-up { color: var(--dpc-todo); }
/* Les autres restent neutres (fin de l'arc-en-ciel) */
.dpc-kpi.k-green .dpc-kpi-up, .dpc-kpi.k-blue .dpc-kpi-up, .dpc-kpi.k-teal .dpc-kpi-up { color: var(--dpc-muted); }

/* ── Onglets : actif = texte encre + soulignage (plus de vert) ── */
.dpc-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--dpc-line); flex-shrink: 0; }
.dpc-tab { display: inline-flex; align-items: center; gap: 7px; padding: 10px 14px; border: none; background: none;
  font-size: 14px; font-weight: 700; color: var(--dpc-faint); cursor: pointer; border-bottom: 2.5px solid transparent; margin-bottom: -1px; transition: color .12s; }
.dpc-tab span { background: #F1F5F9; color: #64748B; font-size: 11px; font-weight: 800; padding: 1px 8px; border-radius: 999px; font-variant-numeric: tabular-nums; }
.dpc-tab:hover { color: #475569; }
.dpc-tab.active { color: var(--dpc-ink); border-bottom-color: var(--dpc-ink); }
.dpc-tab.active span { background: #E2E8F0; color: var(--dpc-ink); }

/* ── Liste de courses ── */
.dpc-list { display: flex; flex-direction: column; gap: 8px; flex: 1; min-height: 0; overflow-y: auto; padding-bottom: 6px; }
.dpc-empty-list { padding: 34px 16px; text-align: center; color: var(--dpc-faint); font-size: 13.5px; }

/* État vide premium de la liste */
.dpc-empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 4px; text-align: center; padding: 28px 24px; }
.dpc-empty-ic { width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center;
  background: #fff; border: 1px solid var(--dpc-line); box-shadow: var(--dpc-e1); margin-bottom: 12px; color: var(--dpc-faint); }
.dpc-empty-ic svg { stroke: var(--dpc-muted); }
.dpc-empty-t { font-size: 16px; font-weight: 800; color: var(--dpc-ink); }
.dpc-empty-s { font-size: 13px; color: var(--dpc-muted); max-width: 320px; line-height: 1.5; }
.dpc-empty-actions { display: flex; align-items: center; gap: 10px; margin-top: 16px; }
.dpc-empty-actions .dpc-btn { height: 40px; padding: 0 16px; }

/* Carte = blanc + filet latéral statut (plus d'aplat plein) */
.dpc-course { display: flex; gap: 12px; align-items: center; border-radius: 12px; padding: 10px 13px;
  background: var(--dpc-surface); border: 1px solid var(--dpc-line); cursor: pointer;
  transition: box-shadow .15s, transform .05s, border-color .15s; }
.dpc-course:hover { box-shadow: var(--dpc-e2); transform: translateY(-1px); }
.dpc-course.selected { border-color: var(--dpc-green); box-shadow: 0 0 0 2px var(--dpc-ring), var(--dpc-e2); }
.dpc-c-time { width: 56px; flex-shrink: 0; display: flex; flex-direction: column; gap: 2px; padding-left: 11px;
  border-left: 3px solid var(--dpc-faint); }
.dpc-c-time b { font-size: 15px; font-weight: 800; color: var(--dpc-ink); font-variant-numeric: tabular-nums; }
.dpc-c-eta { font-size: 10.5px; font-weight: 700; color: var(--dpc-muted); }
.dpc-c-main { flex: 1; min-width: 0; }
.dpc-c-route { font-size: 14px; font-weight: 700; color: var(--dpc-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dpc-c-route svg { vertical-align: middle; margin: 0 3px; }
.dpc-c-sub { font-size: 12px; color: var(--dpc-muted); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dpc-c-sub span { color: #334155; font-weight: 600; }
.dpc-c-meta { display: flex; gap: 6px; margin-top: 5px; }
.dpc-c-meta span { font-size: 11px; font-weight: 600; color: #475569; background: var(--dpc-hover);
  border: 1px solid var(--dpc-line); padding: 2px 8px; border-radius: 7px; }
.dpc-c-side { display: flex; flex-direction: column; align-items: flex-end; gap: 7px; flex-shrink: 0; }
.dpc-badge { font-size: 10.5px; font-weight: 800; padding: 3px 9px; border-radius: 999px; text-transform: uppercase; letter-spacing: .3px;
  display: inline-flex; align-items: center; gap: 5px; }
.dpc-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .9; }
.dpc-driver { font-size: 12px; font-weight: 600; color: #334155; display: flex; align-items: center; gap: 6px; }
.dpc-driver.none { color: var(--dpc-faint); }
.dpc-driver .dpc-av { width: 22px; height: 22px; border-radius: 50%; background: #475569; color: #fff;
  font-size: 10px; font-weight: 800; display: grid; place-items: center; }   /* avatar = slate (plus vert) */
.dpc-c-actions { display: flex; gap: 6px; }
.dpc-btn { height: 32px; padding: 0 12px; border: 1px solid var(--dpc-line); border-radius: 9px; background: #fff;
  font-size: 12.5px; font-weight: 700; color: #334155; cursor: pointer; transition: background .12s, border-color .12s; }
.dpc-btn:hover { background: var(--dpc-hover); }
.dpc-btn.primary { background: var(--dpc-green); border-color: var(--dpc-green); color: #fff; }   /* SEUL accent vert */
.dpc-btn.primary:hover { background: var(--dpc-green-h); border-color: var(--dpc-green-h); }
.dpc-btn.big { height: 42px; padding: 0 16px; font-size: 13.5px; }

/* ── Statuts : filet latéral + ETA + badge (fond blanc, sauf urgence) ── */
.dpc-course.st-urgent   { background: var(--dpc-urgent-bg); border-color: #FBD5D5; }  /* seul voile teinté */
.dpc-course.st-urgent   .dpc-c-time { border-color: var(--dpc-urgent); }
.dpc-course.st-urgent   .dpc-c-eta  { color: var(--dpc-urgent); }
.dpc-badge.b-urgent { background: #FEE2E2; color: var(--dpc-urgent); }

.dpc-course.st-todo     .dpc-c-time { border-color: var(--dpc-todo); }
.dpc-course.st-todo     .dpc-c-eta  { color: var(--dpc-todo); }
.dpc-badge.b-todo   { background: var(--dpc-todo-bg); color: var(--dpc-todo); }

.dpc-course.st-active   .dpc-c-time { border-color: var(--dpc-active); }
.dpc-course.st-active   .dpc-c-eta  { color: var(--dpc-active); }
.dpc-badge.b-active { background: var(--dpc-active-bg); color: var(--dpc-active); }

.dpc-course.st-assigned .dpc-c-time { border-color: var(--dpc-assigned); }   /* ex-vert -> indigo */
.dpc-course.st-assigned .dpc-c-eta  { color: var(--dpc-assigned); }
.dpc-badge.b-assigned { background: var(--dpc-assigned-bg); color: var(--dpc-assigned); }

.dpc-course.st-done     { background: var(--dpc-surface); }
.dpc-course.st-done     .dpc-c-time { border-color: var(--dpc-done); }
.dpc-course.st-done     .dpc-c-eta  { color: var(--dpc-done); }
.dpc-course.st-done     .dpc-c-route { color: var(--dpc-muted); }
.dpc-badge.b-done   { background: var(--dpc-done-bg); color: #475569; }

/* ── Panneau détail — épinglé en bas, état vide propre (plus de tirets) ── */
/* Panneau détail = DRAWER latéral (colonne dédiée dans .dpc-cols).
   Fermé par défaut (#dpc-detail display:none) ; ouvert via .dpc-cols.detail-open. */
.dpc-detail { background: var(--dpc-surface); border: 1px solid var(--dpc-line);
  border-radius: 16px; box-shadow: var(--dpc-e1);
  border-left: 3px solid var(--dpc-line);   /* coloré selon le statut (classes .d-*) */
  min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
/* Le détail vit dans la colonne droite, SOUS la carte (split vertical).
   Fermé : carte pleine hauteur. Ouvert : carte ~58% + détail ~42%. */
#dpc-detail { display: none; }                                   /* fermé par défaut */
.dpc-right { gap: 12px; }
.dpc-cols.detail-open #dpc-detail { display: flex; flex: 0 0 42%; min-height: 0;
  animation: dpc-drawerin .2s ease-out; }
@keyframes dpc-drawerin { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .dpc-cols.detail-open #dpc-detail { animation: none; } }
.dpc-detail.d-urgent   { border-left-color: var(--dpc-urgent); }
.dpc-detail.d-todo     { border-left-color: var(--dpc-todo); }
.dpc-detail.d-active   { border-left-color: var(--dpc-active); }
.dpc-detail.d-assigned { border-left-color: var(--dpc-assigned); }
.dpc-detail.d-done     { border-left-color: var(--dpc-done); }
.dpc-detail .dpc-d-body { overflow-y: auto; }
.dpc-d-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid #F1F5F9; }
.dpc-d-tag { font-size: 12px; font-weight: 800; color: var(--dpc-ink); text-transform: uppercase; letter-spacing: .4px; }
.dpc-d-close { border: none; background: none; cursor: pointer; color: var(--dpc-faint); font-size: 18px; }
.dpc-d-body { padding: 14px 16px; }
.dpc-d-route { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }
.dpc-d-route > div { display: flex; align-items: center; gap: 10px; font-size: 13.5px; color: var(--dpc-text); }
.dpc-d-time { font-size: 14px; font-weight: 800; color: var(--dpc-ink); min-width: 52px; font-variant-numeric: tabular-nums; }
.dpc-pin { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.dpc-pin.from { background: var(--dpc-green); } .dpc-pin.to { background: var(--dpc-urgent); }
.dpc-d-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; }
.dpc-d-grid > div { display: flex; flex-direction: column; }
.dpc-d-grid label, .dpc-d-notes label { font-size: 11px; color: var(--dpc-faint); font-weight: 600; margin-bottom: 2px; text-transform: uppercase; letter-spacing: .3px; }
.dpc-d-grid span { font-size: 13.5px; font-weight: 600; color: var(--dpc-text); }
.dpc-d-notes { margin-top: 12px; } .dpc-d-notes p { margin: 0; font-size: 13px; color: #475569; line-height: 1.5; }
.dpc-d-actions { display: flex; gap: 8px; padding: 12px 16px; border-top: 1px solid #F1F5F9; }

/* ── Panneau détail v2 : en-tête statut + créneau ── */
.dpc-d-head { gap: 12px; }
.dpc-d-head .dpc-d-close { margin-left: auto; }
.dpc-d-when { display: inline-flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 800;
  color: var(--dpc-ink); font-variant-numeric: tabular-nums; }
.dpc-d-when .dpc-d-arrow { color: var(--dpc-faint); font-weight: 700; }
.dpc-d-etachip:not(:empty) { font-size: 10.5px; font-weight: 800; color: var(--dpc-muted);
  background: var(--dpc-hover); border: 1px solid var(--dpc-line); padding: 2px 8px; border-radius: 999px; }

/* Trajet (timeline pins + adresses + connecteur distance) */
.dpc-d-route { gap: 2px; }
.dpc-d-route .dpc-d-rrow { display: flex; align-items: flex-start; gap: 10px; }
.dpc-d-route .dpc-d-rrow .dpc-pin { margin-top: 4px; }
.dpc-d-raddr { font-size: 13.5px; font-weight: 600; color: var(--dpc-text); line-height: 1.35; min-width: 0; }
.dpc-d-route .dpc-d-rdist { display: block; margin: 3px 0 3px 4px; padding: 2px 0 2px 16px;
  border-left: 2px dashed var(--dpc-line); font-size: 11.5px; font-weight: 600; color: var(--dpc-muted); }
.dpc-d-route .dpc-d-rdist[hidden] { display: none; }

/* Essentiels (tuiles) — prix mis en avant */
.dpc-d-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 14px 0; }
.dpc-d-tile { background: var(--dpc-hover); border: 1px solid var(--dpc-line); border-radius: 10px;
  padding: 8px 10px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.dpc-d-tile label { font-size: 10px; font-weight: 700; color: var(--dpc-faint); text-transform: uppercase; letter-spacing: .3px; }
.dpc-d-tile span { font-size: 13px; font-weight: 700; color: var(--dpc-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dpc-d-tile--price { background: var(--dpc-ink); border-color: var(--dpc-ink); }
.dpc-d-tile--price label { color: #94A3B8; }
.dpc-d-tile--price span { font-size: 18px; font-weight: 800; color: #fff; font-variant-numeric: tabular-nums; letter-spacing: -.3px; }

/* Section + client */
.dpc-d-sec { font-size: 11px; font-weight: 800; color: var(--dpc-faint); text-transform: uppercase; letter-spacing: .4px; margin: 4px 0 6px; }
.dpc-d-client { font-size: 14px; font-weight: 700; color: var(--dpc-ink); margin-bottom: 10px; }
.dpc-d-paxrow[hidden], .dpc-d-notes[hidden] { display: none; }

/* État vide du panneau détail : on masque la grille à tirets, on montre une invite discrète */
.dpc-d-empty { display: none; }
.dpc-detail.dpc-detail--empty { border-left-color: var(--dpc-line); max-height: none; }
.dpc-detail--empty .dpc-d-head,
.dpc-detail--empty .dpc-d-body,
.dpc-detail--empty .dpc-d-actions { display: none; }
.dpc-detail--empty .dpc-d-empty { display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 20px 16px; text-align: center; }
.dpc-d-empty svg { color: var(--dpc-faint); }
.dpc-d-empty-t { font-size: 13.5px; font-weight: 700; color: var(--dpc-muted); }
.dpc-d-empty-s { font-size: 12.5px; color: var(--dpc-faint); }

/* ── Carte droite ── */
.dpc-map { position: relative; flex: 1; border-radius: 16px; overflow: hidden; border: 1px solid var(--dpc-line);
  background: linear-gradient(135deg,#EAF1F4,#DCE7EC); min-height: 0; }
#dpc-map-canvas { position: absolute; inset: 0; z-index: 1; }
.dpc-map .leaflet-container { background: #EAF1F4; }
.dpc-map-grid { position: absolute; inset: 0; background-image:
  linear-gradient(rgba(148,163,184,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(148,163,184,.12) 1px, transparent 1px);
  background-size: 46px 46px; }

/* Filtres : segmented control compact, actif en ENCRE (plus de vert) */
.dpc-map-filters { position: absolute; top: 12px; left: 12px; right: 12px; display: flex; gap: 6px; flex-wrap: wrap; z-index: 2; }
.dpc-mf { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px; border-radius: 8px;
  background: rgba(255,255,255,.96); border: 1px solid var(--dpc-line); font-size: 12px; font-weight: 600; color: #334155; cursor: pointer; box-shadow: var(--dpc-e1); }
.dpc-mf:hover { background: #fff; }
.dpc-mf.on { background: var(--dpc-ink); color: #fff; border-color: var(--dpc-ink); }
.dpc-seg { margin-left: auto; display: flex; background: rgba(255,255,255,.96); border: 1px solid var(--dpc-line); border-radius: 8px; overflow: hidden; box-shadow: var(--dpc-e1); }
.dpc-seg button { border: none; background: none; height: 30px; padding: 0 13px; font-size: 12px; font-weight: 700; color: #64748B; cursor: pointer; }
.dpc-seg button.on { background: var(--dpc-ink); color: #fff; }

/* Marqueurs chauffeurs : pastille blanche + initiale + anneau couleur statut */
.leaflet-div-icon.dpc-mk-wrap { background: transparent; border: 0; }
.dpc-mk { width: 27px; height: 27px; border-radius: 50%; display: grid; place-items: center;
  background: #fff; color: var(--dpc-ink); font-size: 10.5px; font-weight: 800; letter-spacing: .2px;
  border: 2px solid var(--mk-ring, var(--dpc-faint));
  box-shadow: 0 1px 2px rgba(16,24,40,.18), 0 3px 8px rgba(16,24,40,.16); }
.dpc-mk-wrap:hover .dpc-mk { transform: scale(1.08); transition: transform .12s; }

.dpc-marker { position: absolute; transform: translate(-50%,-50%); z-index: 2; width: 30px; height: 30px; border-radius: 50%;
  display: grid; place-items: center; background: #fff; box-shadow: 0 3px 8px rgba(16,24,40,.22); }
.dpc-marker.m-green  { color: var(--dpc-green); } .dpc-marker.m-blue { color: var(--dpc-active); } .dpc-marker.m-orange { color: var(--dpc-todo); } .dpc-marker.m-gray { color: var(--dpc-faint); }
.dpc-pinmk { position: absolute; transform: translate(-50%,-100%); z-index: 3; }

.dpc-map-zoom { position: absolute; bottom: 12px; left: 12px; display: flex; flex-direction: column; background: #fff; border-radius: 9px; overflow: hidden; box-shadow: 0 2px 8px rgba(16,24,40,.15); z-index: 2; }
.dpc-map-zoom button { width: 34px; height: 34px; border: none; background: #fff; font-size: 18px; color: #334155; cursor: pointer; }
.dpc-map-zoom button:first-child { border-bottom: 1px solid var(--dpc-line); }

/* Légende : une ligne discrète, opacité réduite */
.dpc-legend { position: absolute; bottom: 12px; right: 12px; display: flex; gap: 10px; align-items: center;
  background: rgba(255,255,255,.82); border: 1px solid var(--dpc-line);
  border-radius: 9px; padding: 5px 9px; font-size: 10.5px; z-index: 2; box-shadow: var(--dpc-e1); backdrop-filter: blur(3px); }
.dpc-legend-row { display: flex; align-items: center; gap: 5px; padding: 0; color: var(--dpc-muted); font-weight: 600; }
.dpc-legend .dpro-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }

/* Activité temps réel : bandeau compact */
.dpc-activity { position: absolute; bottom: 12px; left: 12px; width: 200px; background: rgba(255,255,255,.96); border: 1px solid var(--dpc-line);
  border-radius: 11px; padding: 10px 12px; z-index: 2; box-shadow: var(--dpc-e1); backdrop-filter: blur(2px); }
.dpc-activity-hd { display: flex; align-items: center; justify-content: space-between; font-size: 12px; font-weight: 800; color: var(--dpc-ink); margin-bottom: 6px; }
.dpc-activity-live { display: inline-flex; align-items: center; gap: 5px; font-size: 10.5px; font-weight: 700; color: #16A34A; }
.dpc-activity-live::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #22C55E; box-shadow: 0 0 0 3px rgba(34,197,94,.2); }
.dpc-activity-row { display: flex; justify-content: space-between; font-size: 12px; color: #475569; padding: 3px 0; }
.dpc-activity-row b { color: var(--dpc-ink); font-weight: 800; font-variant-numeric: tabular-nums; }
.dpc-activity-foot { font-size: 10.5px; color: var(--dpc-faint); margin-top: 5px; border-top: 1px solid #F1F5F9; padding-top: 5px; }

/* ===========================================================
   SIDEBAR — finitions premium (Espace Pro UNIQUEMENT)
   Tout est scopé body.dpro-ws-pro → l'espace perso (sidebar
   blanche) n'est jamais affecté. dpc.css se charge après
   dpro.css : ces règles l'emportent sans !important.
   =========================================================== */
/* La sidebar Espace Pro = navigation seule (le CTA principal vit dans le header).
   Scopé pro → l'espace perso garde son bouton « Nouvelle course ». */
body.dpro-ws-pro .dpro-newride { display: none; }

/* Espacements un peu plus aérés */
body.dpro-ws-pro .dpro-nav { gap: 3px; }
body.dpro-ws-pro .dpro-nav-item { padding: 11px 12px; position: relative; transition: background .14s, color .14s; }
body.dpro-ws-pro .dpro-nav-item svg { opacity: .85; }
body.dpro-ws-pro .dpro-nav-item:hover svg { opacity: 1; }

/* État actif premium : plus de pavé vert plein → fond translucide + filet vert fin */
body.dpro-ws-pro .dpro-nav-item.active {
  background: rgba(255,255,255,.07); color: #fff; box-shadow: none; font-weight: 700;
}
body.dpro-ws-pro .dpro-nav-item.active::before {
  content: ""; position: absolute; left: 3px; top: 50%; transform: translateY(-50%);
  width: 3px; height: 18px; border-radius: 2px; background: var(--dpc-green);
}
body.dpro-ws-pro .dpro-nav-item.active svg { opacity: 1; }
body.dpro-ws-pro .dpro-nav-item.active .dpro-nav-badge { background: rgba(255,255,255,.16); color: #fff; }

/* Bloc statut système en bas : petite carte premium */
body.dpro-ws-pro .dpro-sidebar-foot {
  background: #131D33; border: 1px solid #1F2C49; border-radius: 12px;
  padding: 11px 12px; margin: 8px 6px 2px;
}
body.dpro-ws-pro .dpro-status { color: #E2E8F0; font-size: 12.5px; font-weight: 700; }
body.dpro-ws-pro .dpro-status-dot { width: 9px; height: 9px; background: #22C55E; animation: dpc-onlinepulse 2.4s ease-in-out infinite; }
body.dpro-ws-pro .dpro-status-sub { color: #34D399; font-weight: 600; margin-left: 17px; }
body.dpro-ws-pro .dpro-version { color: #5A6B86; padding: 9px 0 0; margin-top: 9px; border-top: 1px solid #1F2C49; }
@keyframes dpc-onlinepulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(34,197,94,.35); }
  50%      { box-shadow: 0 0 0 5px rgba(34,197,94,0); }
}
@media (prefers-reduced-motion: reduce) {
  body.dpro-ws-pro .dpro-status-dot { animation: none; box-shadow: 0 0 0 3px rgba(34,197,94,.18); }
}

/* ===========================================================
   MICRO-INTERACTIONS (léger) — Espace Pro desktop uniquement.
   Scopé .dpc-* (board pro) / body.dpro-ws-pro → zéro mobile/perso.
   Aucune logique ni fonctionnalité modifiée (CSS pur).
   =========================================================== */
/* Apparition douce des cartes quand la liste se remplit (discrète, courte) */
@keyframes dpc-cardin { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
.dpc-list .dpc-course { animation: dpc-cardin .24s ease-out both; }
.dpc-list .dpc-course:nth-child(1) { animation-delay: 0s; }
.dpc-list .dpc-course:nth-child(2) { animation-delay: .03s; }
.dpc-list .dpc-course:nth-child(3) { animation-delay: .06s; }
.dpc-list .dpc-course:nth-child(4) { animation-delay: .09s; }
.dpc-list .dpc-course:nth-child(5) { animation-delay: .12s; }
.dpc-list .dpc-course:nth-child(n+6) { animation-delay: .15s; }

/* Transitions lissées sur les éléments interactifs */
.dpc-btn, .dpc-tab, .dpc-mf, .dpc-seg button, .dpc-dispatch-btn,
.dpc-map-zoom button, .dpc-d-close {
  transition: background .15s, border-color .15s, color .15s, box-shadow .15s, transform .06s;
}
.dpc-btn:active, .dpc-dispatch-btn:active { transform: translateY(1px); }

/* Focus clavier propre : anneau vert discret (uniquement au clavier) */
.dpc-btn:focus-visible, .dpc-tab:focus-visible, .dpc-mf:focus-visible,
.dpc-seg button:focus-visible, .dpc-dispatch-btn:focus-visible,
.dpc-d-close:focus-visible, .dpc-map-zoom button:focus-visible {
  outline: none; box-shadow: 0 0 0 3px var(--dpc-ring);
}
/* Champ de recherche (topbar) + champs des modales Pro */
body.dpro-ws-pro .dpro-search input:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--dpc-ring); }
.dpe-in:focus-visible { box-shadow: 0 0 0 3px var(--dpc-ring); }

/* Respect de prefers-reduced-motion : pas d'animation d'apparition */
@media (prefers-reduced-motion: reduce) {
  .dpc-list .dpc-course { animation: none; }
}

/* ── QA responsive (1024–1280px) : desserrer la densité ──
   Scopé body.dpro-ws-pro → n'affecte que l'Espace Pro desktop ;
   sous 1024px le board est déjà masqué (app mobile). */
@media (max-width: 1280px) {
  body.dpro-ws-pro .dpc-topbar-title { display: none; }   /* libère la topbar serrée */
}
@media (max-width: 1180px) {
  body.dpro-ws-pro .dpc-kpis { grid-template-columns: repeat(2, 1fr); }  /* KPI en 2×2 */
}