/* ==========================================================================
   AGAIN PIPELINE — feuille de style unique
   Charte figée : papier #F7F5F0 · noir #0A0A0A · bleu #2B4BFF
   Titres Archivo · labels et chiffres IBM Plex Mono
   Aucune dépendance, aucun préprocesseur. Éditable à la main.
   ========================================================================== */

:root {
  /* Couleurs de charte */
  --paper:      #F7F5F0;
  --ink:        #0A0A0A;
  --blue:       #2B4BFF;

  /* Neutres dérivés */
  --white:      #FFFFFF;
  --wash:       #FBFAF7;
  --line:       #E3E0D8;
  --line-soft:  #F0EDE6;
  --line-dash:  #D9D6CE;
  --ink-soft:   #4A463F;
  --grey:       #6E6A61;
  --grey-2:     #8E8A82;
  --grey-3:     #A5A099;
  --dark-line:  #232323;

  /* Alerte */
  --red:        #C0301A;
  --red-bg:     #FDF3F0;
  --red-line:   #E7CFC9;

  /* Étapes du pipeline */
  --stage-contact: #D9D6CE;
  --stage-rdv:     #2B4BFF;
  --stage-devis:   #0A0A0A;
  --stage-signe:   #2B4BFF;
  --stage-perdu:   #C0301A;

  /* Typo */
  --font-title: Archivo, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono:  "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  --nav-w: 214px;
  --gut: 30px;
}

/* --------------------------------------------------------------- reset --- */
* { box-sizing: border-box; }

html, body { margin: 0; }

body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-title);
  -webkit-font-smoothing: antialiased;
}

a { color: var(--blue); text-decoration: none; }
a:hover { color: var(--ink); text-decoration: underline; }

input, textarea, select, button { font-family: var(--font-title); color: var(--ink); }
input:focus, textarea:focus, select:focus { outline: 1px solid var(--blue); outline-offset: -1px; }

::selection { background: var(--blue); color: var(--paper); }
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: #DCD8CE; }

[hidden] { display: none !important; }

/* ---------------------------------------------------------- utilitaires --- */
.mono {
  font-family: var(--font-mono);
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.num { font-family: var(--font-mono); letter-spacing: -0.02em; font-weight: 600; }

.label {
  font-family: var(--font-mono);
  font-size: 9.5px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--grey);
}
.label--xs { font-size: 8.5px; letter-spacing: 0.14em; }

.hr { flex: 1; height: 1px; background: var(--line); }

.rule-row { display: flex; align-items: center; gap: 12px; }

.muted { color: var(--grey); }
.hint { font-size: 11.5px; color: var(--grey); }

/* ---------------------------------------------------------------- boutons --- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  cursor: pointer;
  border: 1px solid var(--line);
  background: var(--white);
  color: var(--ink);
  padding: 9px 13px;
  font-family: var(--font-mono);
  font-size: 9.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  transition: background 120ms linear, border-color 120ms linear, color 120ms linear;
}
.btn:hover { border-color: var(--ink); }

.btn--ink   { border-color: var(--ink); background: var(--ink); color: var(--paper); }
.btn--ink:hover { background: #1C1C1C; }

.btn--blue  { border-color: var(--blue); background: var(--blue); color: var(--white); }
.btn--blue:hover { background: var(--ink); border-color: var(--ink); }

.btn--ghost { color: var(--grey); }
.btn--ghost:hover { color: var(--ink); }

.btn--danger { border-color: var(--red-line); background: var(--red-bg); color: var(--red); }
.btn--danger:hover { border-color: var(--red); }

.btn--tall  { height: 38px; padding: 0 16px; font-size: 10.5px; letter-spacing: 0.14em; }
.btn--sq    { width: 34px; height: 34px; padding: 0; font-size: 13px; }
.btn--sq-sm { width: 32px; height: 32px; padding: 0; font-size: 13px; }
.btn--wide  { width: 100%; }

/* ---------------------------------------------------------------- champs --- */
.input, .select, .textarea {
  border: 1px solid var(--line);
  background: var(--white);
  padding: 9px 11px;
  font-size: 13px;
}
.textarea { resize: vertical; line-height: 1.45; }
.input--num { font-family: var(--font-mono); font-size: 13px; }
.input--w80  { width: 80px; }
.input--w110 { width: 110px; }
.input--w120 { width: 120px; }
.input--grow { flex: 1 1 150px; min-width: 0; }

.field { display: flex; flex-direction: column; gap: 6px; }
.field--row { flex-direction: row; align-items: center; gap: 11px; }
.field--span2 { grid-column: span 2; }

/* ------------------------------------------------------------- coquille --- */
.app {
  display: flex;
  min-height: 100vh;
  align-items: stretch;
}

.nav {
  flex: 0 0 var(--nav-w);
  width: var(--nav-w);
  background: var(--ink);
  color: var(--paper);
  padding: 22px 0 18px;
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  height: 100vh;
}
.nav__brand {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 22px 30px;
}
.nav__wordmark { font-weight: 800; font-size: 19px; letter-spacing: 0.19em; }
.nav__mark { width: 9px; height: 9px; background: var(--blue); display: block; }

.nav__items { display: flex; flex-direction: column; }
.nav__item {
  text-align: left;
  cursor: pointer;
  border: 0;
  border-left: 3px solid transparent;
  background: transparent;
  color: var(--grey-2);
  padding: 11px 22px;
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  text-decoration: none;
}
.nav__item:hover { background: #141414; color: var(--paper); text-decoration: none; }
.nav__item.is-active {
  background: #171717;
  color: var(--paper);
  border-left-color: var(--blue);
}
.nav__badge { font-size: 10px; color: var(--grey); }
.nav__item.is-active .nav__badge { color: var(--blue); }

.nav__foot {
  margin-top: auto;
  padding: 18px 22px 0;
  border-top: 1px solid var(--dark-line);
}
.nav__foot-label {
  font-family: var(--font-mono);
  font-size: 9px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--grey);
  margin-bottom: 9px;
}
.nav__users { display: flex; gap: 6px; }
.nav__user {
  flex: 1;
  cursor: pointer;
  border: 1px solid var(--dark-line);
  background: transparent;
  color: var(--grey-2);
  padding: 8px 6px;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.nav__user.is-active { border-color: var(--blue); background: var(--blue); color: var(--white); }
.nav__role { font-size: 11px; color: var(--grey); margin-top: 10px; line-height: 1.4; }

.main {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  padding: 26px var(--gut) 20px;
  border-bottom: 1px solid var(--line);
}
.head__kicker {
  font-family: var(--font-mono);
  font-size: 9.5px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--grey);
  margin-bottom: 8px;
}
.head__title {
  margin: 0;
  font-size: 38px;
  font-weight: 800;
  letter-spacing: -0.035em;
  text-transform: uppercase;
  line-height: 0.95;
}
.head__actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

.search {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--white);
  border: 1px solid var(--line);
  padding: 0 12px;
  height: 38px;
  min-width: 230px;
}
.search__icon { color: var(--grey-3); font-size: 13px; }
.search__input {
  border: 0;
  background: transparent;
  font-size: 13px;
  height: 100%;
  width: 100%;
}
.search__clear {
  cursor: pointer; border: 0; background: transparent;
  color: var(--grey); font-size: 12px; padding: 0;
}

.view { padding: 26px var(--gut) 50px; }
.view--flush { padding: 0 0 50px; }
.view--narrow { max-width: 1000px; }
/* Aujourd'hui : pleine largeur (3 colonnes) */
#view-aujourdhui.view--narrow{max-width:none}
.view--wide { max-width: 1120px; }
.view--stack { display: flex; flex-direction: column; gap: 30px; max-width: 900px; }

/* --------------------------------------------------------------- avatars --- */
.avatar {
  flex: 0 0 auto;
  width: 21px; height: 21px;
  border: 1px solid var(--line);
  background: var(--white);
  color: var(--grey);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-mono);
  font-size: 10px;
}
.avatar--lg { width: 24px; height: 24px; font-size: 11px; }
.avatar--xl { width: 26px; height: 26px; font-size: 11px; }
.avatar[data-owner="N"] { border-color: var(--blue); background: var(--blue); color: var(--white); }
.avatar[data-owner="M"] { border-color: var(--ink); background: var(--ink); color: var(--paper); }

/* ----------------------------------------------------------------- cartes --- */
.card {
  background: var(--white);
  border: 1px solid var(--line);
}
.card--accent { border-left: 3px solid var(--blue); }
.card--dark { background: var(--ink); color: var(--paper); border: 0; }
.card--pad { padding: 20px 22px; }

.empty {
  border: 1px dashed var(--line-dash);
  background: var(--white);
  padding: 44px 22px;
  text-align: center;
}
.empty__title { font-size: 17px; font-weight: 700; letter-spacing: -0.01em; }
.empty__sub { font-size: 13px; color: var(--grey); margin-top: 7px; }
.empty .btn { margin-top: 16px; }

/* ============================================================ CONNEXION === */
.login {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(300px, 460px) 1fr;
}
.login__aside {
  background: var(--ink);
  color: var(--paper);
  padding: 40px 44px;
  display: flex;
  flex-direction: column;
}
.login__claim {
  margin: auto 0;
  font-size: 44px;
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 0.98;
  text-transform: uppercase;
  text-wrap: pretty;
}
.login__claim em { font-style: normal; color: var(--blue); }
.login__foot { font-size: 11.5px; color: var(--grey); line-height: 1.5; }

.login__panel {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 24px;
}
.login__form {
  width: min(380px, 100%);
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.login__title {
  margin: 0;
  font-size: 32px;
  font-weight: 800;
  letter-spacing: -0.03em;
  text-transform: uppercase;
  line-height: 1;
}
.login__error {
  border: 1px solid var(--red-line);
  background: var(--red-bg);
  color: var(--red);
  padding: 11px 13px;
  font-size: 12.5px;
}
.login .input { padding: 12px 13px; font-size: 14px; }
.login__submit { height: 44px; justify-content: center; }

@media (max-width: 720px) {
  .login { grid-template-columns: 1fr; }
  .login__aside { padding: 28px 24px; }
  .login__claim { font-size: 32px; margin: 24px 0; }
}

/* =========================================================== AUJOURD'HUI === */
.kpi-row {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: stretch;
  margin-bottom: 30px;
}

.pitch { flex: 1 1 320px; padding: 20px 22px; }
.pitch__title {
  font-size: 20px; font-weight: 700; letter-spacing: -0.02em;
  line-height: 1.25; text-wrap: pretty;
}
.pitch__sub { font-size: 13px; color: var(--grey); margin-top: 7px; }

.goal { flex: 0 1 300px; padding: 20px 22px; }
.goal__label {
  font-family: var(--font-mono);
  font-size: 9.5px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--grey-2);
}
.goal__value { display: flex; align-items: baseline; gap: 8px; margin: 12px 0 14px; }
.goal__num {
  font-family: var(--font-mono); font-weight: 600; font-size: 40px;
  letter-spacing: -0.04em; color: var(--blue); line-height: 1;
}
.goal__of { font-family: var(--font-mono); font-size: 15px; color: var(--grey-2); }
.goal__bar { height: 4px; background: var(--dark-line); display: flex; }
.goal__bar-fill { background: var(--blue); width: 0; }
.goal__hint { font-size: 11.5px; color: var(--grey-2); margin-top: 11px; }

/* ligne « Objectif RDV / mois » : compacte, sous la barre hebdo */
.goal__month {
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
  margin-top: 13px; padding-top: 9px;
  border-top: 1px solid var(--dark-line);
}
.goal__month-label {
  font-family: var(--font-mono); font-size: 8.5px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--grey-2);
}
.goal__month-label b { color: var(--blue); font-weight: 600; }
.goal__month-val {
  font-family: var(--font-mono); font-size: 14px; font-weight: 600;
  color: var(--paper); white-space: nowrap;
}
.goal__month-val em { font-style: normal; color: var(--grey-2); font-weight: 400; margin-left: 4px; }
.goal__month-val em span { margin-left: 1px; }

/* Liste des sociétés en RDV posé ce mois (hors fiches Théo) — compacte, sur fond sombre */
.goal__month-list { margin-top: 11px; padding-top: 9px; border-top: 1px solid var(--dark-line); }
.goal__month-listhead {
  font-family: var(--font-mono); font-size: 8px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--grey-2); margin-bottom: 6px;
}
.goal__month-chips { display: flex; flex-wrap: wrap; gap: 4px 8px; }
.goal__month-chip {
  font-family: var(--font-mono); font-size: 10px; line-height: 1.35;
  color: var(--paper);
}
.goal__month-chip + .goal__month-chip::before { content: '·'; color: var(--grey-2); margin-right: 8px; }
.goal__month-none { font-size: 11.5px; color: var(--grey-2); font-style: italic; }


.comm {
  flex: 0 0 176px;
  padding: 18px 18px 16px;
  display: flex;
  flex-direction: column;
}
.comm__label {
  font-family: var(--font-mono); font-size: 8.5px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--grey); line-height: 1.5;
}
.comm__total {
  font-family: var(--font-mono); font-weight: 600; font-size: 29px;
  letter-spacing: -0.04em; line-height: 1; white-space: nowrap;
  color: var(--blue); margin: 13px 0 14px;
}
.comm__lines {
  display: flex; flex-direction: column; gap: 10px;
  padding-top: 13px; border-top: 1px solid var(--line);
}
/* Zone de détail : scroll interne si trop de lignes pour ne pas casser le kpi-row */
#commission .comm__lines { max-height: 172px; overflow-y: auto; }
.comm__line-label {
  font-family: var(--font-mono); font-size: 8px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--grey);
}
.comm__line-row {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 8px; margin-top: 4px;
}
.comm__line-calc { font-family: var(--font-mono); font-size: 11px; color: var(--grey); }
.comm__line-amount { font-family: var(--font-mono); font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.comm__prev {
  font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--grey);
  margin-top: auto; padding-top: 14px;
}

/* Détail de commission PAR société dans la carte Aujourd'hui — deux groupes
   « RDV posé » / « Dossier signé », société + montant, sous-total par groupe. */
.comm__grp { display: flex; flex-direction: column; padding-top: 1px; }
.comm__grp + .comm__grp {
  border-top: 1px solid var(--line);
  padding-top: 10px; margin-top: 2px;
}
.comm__grp-title {
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
  font-family: var(--font-mono); font-size: 8px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--ink); font-weight: 600;
  margin-bottom: 6px;
}
.comm__grp-rate { color: var(--grey); font-weight: 500; }
.comm__grp-row {
  display: flex; justify-content: space-between; align-items: baseline; gap: 8px;
  font-size: 11px; line-height: 1.55;
}
.comm__grp-co { color: var(--ink-soft); min-width: 0; }
.comm__grp-amt {
  font-family: var(--font-mono); font-weight: 600; font-size: 11px;
  color: var(--ink); white-space: nowrap;
}
.comm__grp-empty { font-size: 11px; color: var(--grey); font-style: italic; }
.comm__grp-sub {
  display: flex; justify-content: space-between; align-items: baseline; gap: 8px;
  margin-top: 5px; padding-top: 5px; border-top: 1px dashed var(--line);
}
.comm__grp-sublabel {
  font-family: var(--font-mono); font-size: 8px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--grey);
}
.comm__grp-subamt { font-family: var(--font-mono); font-weight: 600; font-size: 11px; color: var(--blue); }

.tasks { display: flex; flex-direction: column; gap: 8px; }
.task {
  background: var(--white);
  border: 1px solid var(--line);
  border-left: 3px solid var(--line-dash);
  padding: 14px 16px;
}
.task[data-urgency="late"]  { border-left-color: var(--red); }
.task[data-urgency="today"] { border-left-color: var(--blue); }
.task__row { display: flex; align-items: flex-start; gap: 14px; flex-wrap: wrap; }
.task__body { flex: 1 1 220px; min-width: 0; }
.task__head { display: flex; align-items: baseline; gap: 9px; flex-wrap: wrap; }
.task__company {
  border: 0; background: transparent; cursor: pointer; padding: 0;
  font-size: 15px; font-weight: 700; letter-spacing: -0.01em;
}
.task__company:hover { color: var(--blue); }
.task__kind {
  font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--grey);
  border: 1px solid var(--line); padding: 2px 6px;
}
.task__label { font-size: 13px; color: var(--ink-soft); margin-top: 5px; }
.task__due {
  font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--grey); margin-top: 7px;
}
.task__due[data-urgency="late"]  { color: var(--red); }
.task__due[data-urgency="today"] { color: var(--blue); }
.task__actions { display: flex; gap: 7px; flex: 0 0 auto; align-items: center; }
.task__log {
  margin-top: 14px; padding-top: 14px;
  border-top: 1px dashed var(--line);
  display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
}
.task__log .select { flex: 1 1 180px; }

/* ============================================================== PIPELINE === */
.filters {
  display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
  padding: 14px var(--gut);
  border-bottom: 1px solid var(--line);
  background: var(--white);
}
.filter { display: flex; align-items: center; gap: 7px; }
.filter__label {
  font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--grey);
}
.filter .select { padding: 7px 9px; font-size: 12.5px; max-width: 190px; }
.filters__reset { margin-left: auto; }

.board {
  display: flex; gap: 14px;
  padding: 18px var(--gut) 50px;
  overflow-x: auto;
  align-items: flex-start;
}
.col { flex: 0 0 286px; width: 286px; min-height: 260px; }
.col__head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 8px; padding-bottom: 9px;
  border-bottom: 2px solid var(--line-dash);
}
.col[data-stage="rdv"]   .col__head { border-bottom-color: var(--stage-rdv); }
.col[data-stage="devis"] .col__head { border-bottom-color: var(--stage-devis); }
.col[data-stage="signe"] .col__head { border-bottom-color: var(--stage-signe); }
.col[data-stage="perdu"] .col__head { border-bottom-color: var(--stage-perdu); }
.col__label {
  font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.15em;
  text-transform: uppercase; font-weight: 600;
}
.col__meta { font-family: var(--font-mono); font-size: 10px; color: var(--grey); }
.col__body { display: flex; flex-direction: column; gap: 8px; padding-top: 10px; }
.col.is-over .col__body { outline: 1px dashed var(--blue); outline-offset: 4px; }

.deal {
  position: relative;
  overflow: hidden;
  background: var(--white);
  border: 1px solid var(--line);
  border-left: 3px solid var(--line-dash);
  padding: 13px 14px;
  cursor: grab;
}
.deal:hover { border-color: var(--blue); }
.deal.is-dragging { opacity: 0.4; }
.deal[data-stage="rdv"]   { border-left-color: var(--stage-rdv); }
.deal[data-stage="devis"] { border-left-color: var(--stage-devis); }
.deal[data-stage="signe"] { border-left-color: var(--stage-signe); }
.deal[data-stage="perdu"] { border-left-color: var(--stage-perdu); }
.deal__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 9px; }
.deal__company { font-size: 14.5px; font-weight: 700; letter-spacing: -0.01em; line-height: 1.2; }
.deal__contact { font-size: 12.5px; color: var(--grey); margin-top: 4px; }
.deal__pills { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 10px; }
.pill {
  font-family: var(--font-mono); font-size: 8.5px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--grey);
  border: 1px solid var(--line); padding: 3px 6px;
}
.pill[data-heat="chaud"] { color: var(--blue); }
.pill[data-heat="froid"] { color: var(--grey-3); }
.deal__amount {
  font-family: var(--font-mono); font-size: 13px; font-weight: 600;
  letter-spacing: -0.02em; margin-top: 11px;
}
.deal__due {
  display: flex; align-items: center; gap: 7px;
  margin-top: 11px; padding-top: 10px;
  border-top: 1px dashed var(--line);
}
.dot { width: 5px; height: 5px; flex: 0 0 auto; background: var(--grey-3); }
.deal__due-label {
  font-family: var(--font-mono); font-size: 9.5px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--grey);
}
.deal__due[data-urgency="late"]  .dot,
.deal__due[data-urgency="late"]  .deal__due-label { background: var(--red); color: var(--red); }
.deal__due[data-urgency="today"] .dot,
.deal__due[data-urgency="today"] .deal__due-label { background: var(--blue); color: var(--blue); }
.deal__next {
  font-size: 11.5px; color: var(--grey);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.deal__stale {
  margin-top: 9px;
  font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--red);
}

/* prochain RDV planifié sur la carte */
.deal__rdv {
  display: flex; align-items: center; gap: 7px;
  margin-top: 8px;
}
.pill--rdv {
  font-family: var(--font-mono); font-size: 8.5px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--white);
  background: var(--blue); border-color: var(--blue); border-radius: 4px;
  padding: 2px 6px;
}
.deal__rdv-date {
  font-family: var(--font-mono); font-size: 11px; font-weight: 600;
  color: var(--blue); white-space: nowrap;
}
.drop-hint {
  border: 1px dashed var(--line-dash);
  padding: 20px 12px; text-align: center;
  font-family: var(--font-mono); font-size: 9.5px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--grey-3);
}

/* ============================================================== CONTACTS === */
.alpha {
  display: flex; gap: 6px; flex-wrap: wrap; align-items: center;
  padding: 13px var(--gut);
  border-bottom: 1px solid var(--line);
  background: var(--white);
  position: sticky; top: 0; z-index: 10;
}
.alpha__btn {
  cursor: pointer;
  border: 1px solid var(--line);
  background: var(--white);
  color: var(--ink);
  width: 26px; height: 26px;
  font-family: var(--font-mono); font-size: 10px;
  display: flex; align-items: center; justify-content: center;
}
.alpha__btn:disabled { color: var(--line-dash); cursor: default; }
.alpha__btn.is-active { border-color: var(--blue); background: var(--blue); color: var(--white); }
.alpha__all { margin-left: auto; padding: 7px 11px; }

.contacts-body { padding: 0 var(--gut); }
.table-head {
  display: flex; gap: 16px;
  padding: 13px 4px 10px;
  border-bottom: 1px solid var(--line);
  font-family: var(--font-mono); font-size: 8.5px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--grey);
}
.c-1 { flex: 1 1 230px; min-width: 0; }
.c-2 { flex: 1 1 180px; min-width: 0; }
.c-3 { flex: 0 0 170px; min-width: 0; }
.c-4 { flex: 0 0 130px; }
.c-5 { flex: 0 0 110px; text-align: right; }
.c-6 { flex: 0 0 26px; }

.group__head { display: flex; align-items: center; gap: 12px; padding: 18px 4px 8px; }
.group__letter { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.2em; color: var(--blue); }
.group__count { font-family: var(--font-mono); font-size: 9.5px; color: var(--grey); }

.row {
  width: 100%; text-align: left; cursor: pointer;
  display: flex; gap: 16px; align-items: center; flex-wrap: wrap;
  background: var(--white);
  border: 1px solid var(--line);
  border-left: 3px solid var(--line-dash);
  padding: 13px 14px; margin-bottom: 6px;
}
.row:hover { border-color: var(--blue); }
.row[data-stage="rdv"]   { border-left-color: var(--stage-rdv); }
.row[data-stage="devis"] { border-left-color: var(--stage-devis); }
.row[data-stage="signe"] { border-left-color: var(--stage-signe); }
.row[data-stage="perdu"] { border-left-color: var(--stage-perdu); }
.row__company { display: block; font-size: 14.5px; font-weight: 700; letter-spacing: -0.01em; }
.row__contact { display: block; font-size: 12.5px; color: var(--grey); margin-top: 3px; }
.row__sector  { display: block; font-size: 12.5px; }
.row__place {
  display: block;
  font-family: var(--font-mono); font-size: 9.5px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--grey); margin-top: 4px;
}
.row__coord { font-family: var(--font-mono); font-size: 10.5px; color: var(--grey); overflow: hidden; }
.row__coord span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.row__coord span + span { margin-top: 4px; }
.row__amount { font-family: var(--font-mono); font-size: 13px; font-weight: 600; letter-spacing: -0.02em; }
.row__avatar { display: flex; justify-content: flex-end; }

.stage-tag {
  display: inline-block;
  font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.1em;
  text-transform: uppercase;
  border: 1px solid var(--line); color: var(--grey);
  padding: 3px 7px;
}
.stage-tag[data-stage="rdv"]   { border-color: var(--blue); color: var(--blue); }
.stage-tag[data-stage="devis"] { border-color: var(--ink);  color: var(--ink); }
.stage-tag[data-stage="signe"] { border-color: var(--blue); color: var(--white); background: var(--blue); }
.stage-tag[data-stage="perdu"] { border-color: var(--red-line); color: var(--red); background: var(--red-bg); }
.row__due {
  display: block;
  font-family: var(--font-mono); font-size: 9.5px; color: var(--grey);
  margin-top: 6px; letter-spacing: 0.08em; text-transform: uppercase;
}
.row__due[data-urgency="late"] { color: var(--red); }

/* ============================================================ POINT HEBDO === */
.week-nav { display: flex; align-items: center; gap: 10px; margin-bottom: 22px; flex-wrap: wrap; }
.week-nav__label { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; }
.week-nav__vs { font-size: 12px; color: var(--grey); }

.kpi-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);   /* une seule ligne, pleine largeur */
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
  margin-bottom: 26px;
}
@media (max-width: 980px) { .kpi-grid { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); } }
.kpi { background: var(--white); padding: 18px 20px; }
.kpi__label {
  font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--grey); margin-bottom: 12px;
}
.kpi__row { display: flex; align-items: baseline; gap: 7px; }
.kpi__value {
  font-family: var(--font-mono); font-weight: 600; font-size: 32px;
  letter-spacing: -0.04em; line-height: 1; white-space: nowrap;
}
.kpi__value[data-tone="blue"] { color: var(--blue); }
.kpi__delta { font-family: var(--font-mono); font-size: 10.5px; color: var(--grey); }
.kpi__delta[data-tone="up"]   { color: var(--blue); }
.kpi__delta[data-tone="down"] { color: var(--red); }
.kpi__hint { font-size: 11.5px; color: var(--grey); margin-top: 9px; }

.panels { display: flex; gap: 20px; flex-wrap: wrap; align-items: flex-start; }
.panel { flex: 1 1 320px; border: 1px solid var(--line); background: var(--white); padding: 20px 22px; }
.panel__label { margin-bottom: 16px; }

.bars { display: flex; flex-direction: column; gap: 12px; }
.bar__row { display: flex; justify-content: space-between; gap: 10px; font-size: 12.5px; margin-bottom: 5px; }
.bar__count { font-family: var(--font-mono); color: var(--grey); }
.bar__track { height: 5px; background: var(--line-soft); display: flex; }
.bar__fill { background: var(--blue); width: 0; }

.lost-list { display: flex; flex-direction: column; gap: 10px; }
.lost-item {
  display: flex; justify-content: space-between; gap: 12px;
  padding-bottom: 10px; border-bottom: 1px solid var(--line-soft);
}
.lost-item__company { display: block; font-size: 13.5px; font-weight: 600; }
.lost-item__reason { display: block; font-size: 11.5px; color: var(--grey); margin-top: 3px; }
.lost-item__amount { font-family: var(--font-mono); font-size: 11.5px; color: var(--grey); flex: 0 0 auto; }

.decide { margin-top: 20px; border: 1px solid var(--line); background: var(--white); }
.decide__head {
  padding: 18px 22px 14px; border-bottom: 1px solid var(--line);
  display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
}
.decide__count { font-family: var(--font-mono); font-size: 10px; color: var(--grey); }
.decide__row {
  width: 100%; text-align: left; cursor: pointer;
  border: 0; border-bottom: 1px solid var(--line-soft);
  background: var(--white); padding: 15px 22px;
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
}
.decide__row:hover { background: var(--wash); }
.decide__company { flex: 1 1 200px; font-size: 14.5px; font-weight: 700; letter-spacing: -0.01em; }
.decide__why { flex: 1 1 220px; font-size: 12.5px; color: var(--grey); }
.decide__amount { font-family: var(--font-mono); font-size: 12px; font-weight: 600; }

/* =============================================================== RÉGLAGES === */
.set-block__label { margin-bottom: 12px; }
.set-list { border: 1px solid var(--line); background: var(--white); }
.set-row {
  display: flex; gap: 10px; align-items: center;
  padding: 12px 16px; border-bottom: 1px solid var(--line-soft);
  flex-wrap: wrap;
}
.set-row__name { flex: 1 1 240px; }
.set-row__rank { font-family: var(--font-mono); font-size: 11px; color: var(--grey); width: 34px; }
.set-row__note { font-size: 12.5px; color: var(--grey); flex: 1 1 140px; }
.set-list__foot { padding: 13px 16px; }
.set-cols { display: flex; gap: 20px; flex-wrap: wrap; }
.set-card { flex: 1 1 240px; border: 1px solid var(--line); background: var(--white); padding: 20px 22px; }
.set-card__label { margin-bottom: 14px; }
.set-card .field--row + .field--row { margin-top: 12px; }
.set-card__sub {
  font-family: var(--font-mono); font-size: 8.5px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--grey); margin: 20px 0 12px;
}
.user-list { display: flex; flex-direction: column; gap: 12px; }
.user { display: flex; align-items: center; gap: 12px; }
.user__name { display: block; font-size: 13.5px; font-weight: 600; }
.user__role { display: block; font-size: 11.5px; color: var(--grey); }

/* ================================================== MODALES ET PANNEAU === */
.scrim { position: absolute; inset: 0; background: rgba(10, 10, 10, 0.42); border: 0; padding: 0; }

.overlay { position: fixed; inset: 0; z-index: 60; display: flex; }
.overlay--right { justify-content: flex-end; z-index: 40; }
.overlay--center {
  justify-content: center; align-items: flex-start;
  padding: 4vh 16px; overflow-y: auto;
}
.overlay--center-tight { justify-content: center; align-items: flex-start; padding: 8vh 16px; z-index: 70; }
.overlay--right .scrim { background: rgba(10, 10, 10, 0.3); }

/* Panneau fiche prospect */
.drawer {
  position: relative;
  width: min(500px, 100vw);
  height: 100%;
  background: var(--white);
  border-left: 1px solid var(--line);
  overflow-y: auto;
}
.drawer__head {
  background: var(--ink); color: var(--paper);
  padding: 22px 26px 20px;
  position: sticky; top: 0; z-index: 2;
}
.drawer__head-row { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.drawer__kicker {
  font-family: var(--font-mono); font-size: 9.5px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--grey-2); margin-bottom: 9px;
}
.drawer__company {
  font-size: 25px; font-weight: 800; letter-spacing: -0.025em;
  line-height: 1.1; text-transform: uppercase;
}
.drawer__meta { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 9px; align-items: center; }
.drawer__city {
  font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--grey-2);
}
.drawer__close {
  flex: 0 0 auto; cursor: pointer;
  border: 1px solid #333333; background: transparent; color: var(--paper);
  width: 32px; height: 32px; font-size: 13px;
}
.drawer__body { padding: 0 26px 40px; display: flex; flex-direction: column; gap: 26px; }
.drawer__stages { display: flex; gap: 6px; flex-wrap: wrap; padding-top: 20px; }
.drawer__stages .btn.is-active { border-color: var(--blue); background: var(--blue); color: var(--white); }

.block__label { margin-bottom: 11px; }
.block__head {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 10px; margin-bottom: 11px;
}
.box { border: 1px solid var(--line); padding: 15px 17px; }
.box--accent { border-left: 3px solid var(--blue); }
.box--danger { border: 1px solid var(--red-line); background: var(--red-bg); padding: 15px 17px; }
.box--danger .label { color: var(--red); margin-bottom: 7px; }
.box__text { font-size: 13.5px; line-height: 1.45; }
.box__row { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.box__row + .box__row { margin-top: 10px; }
.box__status {
  font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--grey); margin-top: 11px;
}
.box__status[data-tone="blue"] { color: var(--blue); }
.box__status[data-tone="late"] { color: var(--red); }

.facts {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1px;
  background: var(--line); border: 1px solid var(--line);
}
.fact { background: var(--white); padding: 13px 15px; }
.fact__k {
  font-family: var(--font-mono); font-size: 8.5px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--grey); margin-bottom: 6px;
}
.fact__v { font-size: 13.5px; font-weight: 500; line-height: 1.35; }

.contact-card__name { font-size: 15px; font-weight: 700; }
.contact-card__role { font-size: 12px; color: var(--grey); margin-top: 3px; }
.contact-card__links { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 13px; }
.chip-link {
  font-family: var(--font-mono); font-size: 11px;
  border: 1px solid var(--line); padding: 8px 10px; color: var(--ink);
}
.chip-link:hover { border-color: var(--blue); text-decoration: none; }

.split { display: flex; gap: 14px; flex-wrap: wrap; }
.split > * { flex: 1 1 190px; }
.split__label { margin-bottom: 8px; }
.split__text { font-size: 13px; line-height: 1.5; text-wrap: pretty; }

.quote-lines {
  margin-top: 14px; padding-top: 13px;
  border-top: 1px dashed var(--line);
  display: flex; flex-direction: column; gap: 6px;
}
.quote-line { display: flex; justify-content: space-between; gap: 12px; font-size: 12.5px; }
.quote-line__price { font-family: var(--font-mono); color: var(--grey); flex: 0 0 auto; }

/* — Prestations interactives (coche + total HT) — */
.quote-lines__head { display: block; margin-bottom: 2px; }
.quote-lines__head { color: var(--grey-2); }
.quote-lines__row {
  display: flex; gap: 9px; align-items: baseline;
  padding: 4px 0; font-size: 12.5px;
}
.quote-lines__row input[type="checkbox"] {
  width: 14px; height: 14px; accent-color: var(--blue);
  align-self: center; margin: 0; flex: 0 0 auto;
}
.quote-lines__name { flex: 1 1 auto; }
.quote-lines__price { font-family: var(--font-mono); font-size: 12px; color: var(--ink-soft); flex: 0 0 auto; }
.quote-lines__row.is-off .quote-lines__name,
.quote-lines__row.is-off .quote-lines__price { color: var(--grey-3); text-decoration: line-through; }
.quote-lines__empty { padding: 6px 0 2px; font-size: 12px; color: var(--grey-3); }
.quote-lines__total {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line);
}
.quote-lines__total .label { color: var(--grey); }
.quote-lines__total-val {
  font-family: var(--font-mono); font-size: 18px; font-weight: 600;
  letter-spacing: -0.02em; color: var(--blue);
}

/* — Cycle du devis : barre d'étapes compacte — */
.dv-cycle {
  border: 1px solid var(--line); background: var(--white);
  padding: 11px 12px 10px;
  display: flex; flex-direction: column; gap: 9px;
}
.dv-cyc-head { display: flex; justify-content: space-between; align-items: center; }
.dv-cyc-head .label { color: var(--grey-2); }
.dv-cycle__track { display: flex; align-items: center; gap: 0; }
.dv-cyc {
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  flex: 0 0 auto; min-width: 46px;
}
.dv-cyc__n {
  width: 16px; height: 16px; border-radius: 50%;
  border: 1px solid var(--line); background: var(--white); color: var(--grey-3);
  font-family: var(--font-mono); font-size: 9px; line-height: 15px;
  text-align: center;
}
.dv-cyc__t {
  font-family: var(--font-mono); font-size: 7.5px; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--grey-3); white-space: nowrap;
}
.dv-cyc.is-done .dv-cyc__t { color: var(--ink-soft); }
.dv-cyc.is-on .dv-cyc__n { background: var(--blue); border-color: var(--blue); color: var(--white); }
.dv-cyc.is-on .dv-cyc__t { color: var(--blue); font-weight: 600; }
.dv-cyc__ln { flex: 1 1 auto; height: 1px; background: var(--line); }
.dv-cyc__ln.is-fill { background: var(--blue); opacity: .35; }
.dv-cycle__meta {
  color: var(--grey); padding: 4px 0 0;
  display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.file-label {
  cursor: pointer; border: 1px solid var(--line); background: var(--white);
  color: var(--grey); padding: 9px 12px;
  font-family: var(--font-mono); font-size: 9.5px; letter-spacing: 0.1em;
  text-transform: uppercase;
}
.file-label:hover { border-color: var(--ink); color: var(--ink); }

.timeline { border: 1px solid var(--line); }
.timeline__item {
  display: flex; gap: 12px; align-items: baseline;
  padding: 11px 15px; border-bottom: 1px solid var(--line-soft);
}
.timeline__date { font-family: var(--font-mono); font-size: 10.5px; color: var(--grey); flex: 0 0 62px; }
.timeline__channel {
  font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.1em;
  text-transform: uppercase; border: 1px solid var(--line);
  padding: 2px 6px; flex: 0 0 auto;
}
.timeline__result { font-size: 12.5px; color: var(--ink-soft); }
.timeline__empty { padding: 13px 15px; font-size: 12.5px; color: var(--grey-3); }
.timeline__form { display: flex; gap: 8px; flex-wrap: wrap; padding: 12px 15px; }
.timeline__form .select { flex: 1 1 150px; }

.note-form { display: flex; gap: 8px; margin-bottom: 14px; }
.note-form .textarea { flex: 1; padding: 10px 12px; font-size: 13px; }
.note-form .btn { padding: 0 14px; flex: 0 0 auto; }
.notes { display: flex; flex-direction: column; gap: 14px; }
.note { border-left: 2px solid var(--line); padding-left: 13px; }
.note__meta {
  font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--grey);
}
.note__text { font-size: 13.5px; line-height: 1.5; margin-top: 5px; text-wrap: pretty; }

/* Modales de formulaire */
.modal {
  position: relative;
  width: min(620px, 100%);
  background: var(--white);
  border: 1px solid var(--line);
}
.modal--sm { width: min(470px, 100%); }
.modal--lg { width: min(640px, 100%); }
.modal__head { background: var(--ink); color: var(--paper); padding: 20px 24px; }
.modal__head--light { background: var(--white); color: var(--ink); border-bottom: 1px solid var(--line); }
.modal__kicker {
  font-family: var(--font-mono); font-size: 9.5px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--grey-2); margin-bottom: 8px;
}
.modal__head--light .modal__kicker { color: var(--red); }
.modal__title { font-size: 23px; font-weight: 800; letter-spacing: -0.025em; text-transform: uppercase; }
.modal__title--sm { font-size: 20px; letter-spacing: -0.02em; }
.modal__body { padding: 22px 24px; display: flex; flex-direction: column; gap: 20px; }
.modal__body--grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.modal__body--tight { gap: 8px; padding: 20px 24px; }
.modal__foot {
  display: flex; justify-content: flex-end; gap: 10px;
  padding: 17px 24px; border-top: 1px solid var(--line); background: var(--paper);
}
.modal .input, .modal .select, .modal .textarea { padding: 10px 12px; font-size: 13.5px; }

.choices { display: flex; gap: 7px; flex-wrap: wrap; }
.choices .btn.is-active { border-color: var(--blue); background: var(--blue); color: var(--white); }
.choices--stack { flex-direction: column; }
.choice-wide {
  text-align: left; cursor: pointer;
  border: 1px solid var(--line); background: var(--white); color: var(--ink);
  padding: 12px 14px; font-size: 13.5px;
}
.choice-wide:hover { border-color: var(--ink); }
.choice-wide.is-active { border-color: var(--red); background: var(--red-bg); color: var(--red); }

.line-list { border: 1px solid var(--line); }
.line-row {
  display: flex; gap: 11px; align-items: center;
  padding: 11px 14px; border-bottom: 1px solid var(--line-soft); flex-wrap: wrap;
}
.line-row input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--blue); }
.line-row__name { flex: 1 1 180px; font-size: 13.5px; }
.line-row input[type="checkbox"]:not(:checked) ~ .line-row__name { color: var(--grey-3); }
.line-row__type {
  font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--grey);
}
.line-total {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 13px 14px; background: var(--paper);
}
.line-total__value {
  font-family: var(--font-mono); font-size: 21px; font-weight: 600;
  letter-spacing: -0.03em; color: var(--blue);
}

/* -------------------------------------------------------------- notification --- */
.toast {
  position: fixed; bottom: 18px; left: 50%; transform: translateX(-50%);
  z-index: 90;
  background: var(--ink); color: var(--paper);
  padding: 12px 18px;
  font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.14em;
  text-transform: uppercase;
}

/* ------------------------------------------------- compléments de classes --- */
.nav__signout { margin-top: 12px; }
.tasks-rule { margin-bottom: 14px; }
.input--w74 { width: 74px; }
.field--flex { flex: 1 1 190px; }
.set-card__text { font-size: 13.5px; }
.contacts-empty { margin-top: 20px; }
.lost-date { margin-top: 6px; }

/* ------------------------------------------------------------------ mobile --- */
@media (max-width: 860px) {
  .app { flex-direction: column; }
  .nav { position: static; height: auto; width: 100%; flex: none; padding-bottom: 12px; }
  .nav__items { flex-direction: row; overflow-x: auto; }
  .nav__item { border-left: 0; border-bottom: 3px solid transparent; white-space: nowrap; }
  .nav__item.is-active { border-left: 0; border-bottom-color: var(--blue); }
  .nav__foot { margin-top: 14px; }
  .head__title { font-size: 30px; }
  .facts, .modal__body--grid { grid-template-columns: 1fr; }
  :root { --gut: 18px; }
}

/* Présentation du détail produit dans la carte du pipeline */
.deal__lines{display:flex;flex-direction:column;gap:2px;margin-top:6px}
.deal__line{font-family:var(--font-mono);font-size:10px;color:var(--grey);line-height:1.4}
.deal__line b{font-weight:600;color:var(--ink)}
.deal__line--more{color:var(--blue)}

/* Rangée de KPIs au-dessus du kanban pipeline */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:14px}
.kpis .kpi{background:var(--paper);border:1px solid var(--line-soft);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:2px}
.kpis .kpi__num{font-family:var(--font-mono);font-weight:600;font-size:20px;color:var(--ink)}
.kpis .kpi__label{font-size:11px;letter-spacing:.02em;color:var(--grey)}

/* En-tête de groupe dans les tâches (En retard / Aujourd'hui / Plus tard) */
.task-head{margin:14px 0 6px;padding:4px 10px;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);background:transparent;border-left:3px solid var(--blue)}
.task-head:first-child{margin-top:0}

/* Bouton Archiver discret en bas de carte du pipeline */
.deal__archive{margin-top:8px;padding:2px 6px;font-size:10px;font-family:var(--font-mono);color:var(--grey);background:transparent;border:1px dashed var(--line);border-radius:6px;cursor:pointer;opacity:.75}
.deal__archive:hover{opacity:1;color:var(--blue);border-color:var(--blue)}

/* Bouton suppression sur une ligne Contacts */
.c-7{display:flex;align-items:center}
.row__del{width:22px;height:22px;line-height:1;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--grey);font-size:12px;cursor:pointer;opacity:.7}
.row__del:hover{color:#fff;background:var(--danger,var(--red));border-color:var(--danger,var(--red));opacity:1}

/* Commission du mois (détail par client) — Point hebdo */
.comm-detail{margin-top:26px}
.comm-detail .panel__head{display:flex;justify-content:space-between;align-items:baseline}
.comm-detail__total{font-family:var(--font-mono);font-weight:600;font-size:18px;color:var(--blue)}
#comm-rows{display:flex;flex-direction:column}
.comm-line{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:11px 0;border-bottom:1px solid var(--line-soft);flex-wrap:wrap}
.comm-line__company{font-size:14px;font-weight:600;width:26%}
.comm-line__sub{display:flex;flex-direction:column;gap:2px;font-size:12px;color:var(--grey)}
.comm-line__item{font-family:var(--font-mono);font-size:11px}
.comm-line__amount{font-family:var(--font-mono);font-weight:600;color:var(--ink)}

/* Notes du point (timeline dans « À décider ») — date récente en haut */
.decide__notes{margin-top:18px;border-top:1px dashed var(--line);padding-top:12px;display:flex;flex-direction:column;gap:10px}
.podnote{display:flex;flex-direction:column;gap:4px;padding:8px 10px;border:1px solid var(--line-soft);border-radius:8px;background:var(--paper)}
.podnote__date{font-family:var(--font-mono);font-size:10px;color:var(--blue);letter-spacing:.04em}
.podnote__body{font-size:13px;white-space:pre-wrap}
.podnote__view{display:flex;flex-direction:column;gap:4px}
.podnote__edit{align-self:flex-start;font-size:11px;border:none;background:none;color:var(--grey);cursor:pointer}
.podnote__editbox{display:flex;flex-direction:column;gap:8px}
.podnote__editbox .input{width:100%}
.podnote__btns{display:flex;gap:6px}
.podnote__btns .mic{width:40px}
.decide__form{margin-top:12px;display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end}
.decide__form textarea{flex:1 1 100%;min-width:220px}
.decide__form .mic{flex:0 0 auto}
.decide__form .podnote-date{flex:0 1 160px}
.btn.is-listening{background:var(--red);color:#fff}

/* Point hebdo : contenu principal gauche + rail droit (commission) */
.ph-cols{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:22px;align-items:start}
.ph-aside{position:sticky;top:20px;display:flex;flex-direction:column;gap:16px}
.ph-aside .comm-detail{margin-top:0}
@media (max-width:1100px){ .ph-cols{grid-template-columns:1fr} .ph-aside{position:static} }

/* Mise en forme compacte du bloc commission dans le rail droit */
.ph-aside .comm-line{flex-direction:column;gap:4px}
.ph-aside .comm-line__company{width:auto}
.ph-aside .comm-line__amount{align-self:flex-end}

/* Actions lecture d'une note (modifier / supprimer) */
.podnote__acts{display:flex;gap:6px;margin-top:2px}
.podnote__acts button{border:none;background:none;font-size:13px;cursor:pointer;line-height:1;opacity:.7;padding:2px}
.podnote__acts button:hover{opacity:1}
.podnote__del:hover{opacity:1}

/* ===== Block "À décider / notes" : rendu timeline ===== */
.decide__notes{position:relative;margin:20px 0 6px;padding-left:22px;border-left:2px solid var(--line);display:flex;flex-direction:column;gap:4px}
.podnote{position:relative;margin:0;padding:10px 4px 12px 6px;border:none;background:transparent}
.podnote::before{content:'';position:absolute;left:-28px;top:12px;width:9px;height:9px;border-radius:50%;background:var(--blue);border:2px solid var(--paper);box-sizing:border-box}
.podnote__date{font-family:var(--font-mono);font-size:11px;letter-spacing:.04em;color:var(--blue);font-weight:600;margin-bottom:2px}
.podnote__body{font-size:14px;color:var(--ink);white-space:pre-wrap;line-height:1.5}
.podnote__acts{display:flex;gap:2px;margin-top:4px;opacity:.5;transition:opacity .15s}
.podnote:hover .podnote__acts,.podnote__acts:hover{opacity:1}
.podnote__edit,.podnote__del{font:inherit;border:none;background:none;font-size:13px;color:var(--grey);cursor:pointer;padding:1px 5px;border-radius:5px}
.podnote__edit:hover{color:var(--blue)}
.podnote__del:hover{color:var(--red)}
/* édition (cartes) */
.podnote__editbox{display:flex;flex-direction:column;gap:8px;border:1px solid var(--line);border-radius:8px;padding:10px;background:var(--white)}
.podnote__editbox .input{width:100%}
/* formulaire d'ajout : grande zone */
.podnote-form:not(._x){}
.decide__form{background:var(--paper);border:1px solid var(--line-soft);border-radius:10px;padding:12px;display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;margin-top:14px}
.decide__form textarea{flex:1 1 100%;min-height:74px}
.decide__form .mic{flex:0 0 auto}
.decide__form .podnote-date{flex:0 1 170px}
.decide__form .btn--blue{flex:0 0 auto}

/* Statut Client dans la fiche prospect */
.drawer__client{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--line-soft);border-radius:8px;background:var(--paper);margin-bottom:10px}
.drawer__client input{width:16px;height:16px;accent-color:var(--blue);margin:0}
.drawer__client span{font-size:13px;font-weight:700;color:var(--ink)}
.drawer__client-hint{font-weight:400;color:var(--grey)}

/* Attribution responsable : Théo / Camille */
.fiche-owner{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 8px;border:1px solid var(--line-soft);border-radius:8px;background:var(--paper);max-width:100%}
.fiche-owner .label{margin:0}
.fiche-owner select{flex:0 0 auto;border:1px solid var(--line);border-radius:6px;background:var(--paper);color:var(--ink);font-size:12.5px;font-weight:600;padding:4px 7px;cursor:pointer}
CSS echo ok

/* Statut Client dans la fiche prospect */
.drawer__client > span{font-size:13px;font-weight:700;color:var(--ink)}


/* ===== Fiche prospect : drawer latéral large, multi-colonnes ===== */
[data-modal="fiche"]{display:flex;align-items:stretch;justify-content:flex-end}
[data-modal="fiche"] .drawer{position:relative;width:100vw;height:100vh;display:flex;flex-direction:column;border-radius:0;box-shadow:-18px 0 60px rgba(0,0,0,.18)}
[data-modal="fiche"] .drawer__head{flex:0 0 auto}
[data-modal="fiche"] .drawer__body{flex:1;overflow-y:auto;padding:24px 30px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 28px;align-content:start}
@media(max-width:1100px){[data-modal="fiche"] .drawer__body{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){[data-modal="fiche"] .drawer__body{grid-template-columns:1fr}}
.drawer__col{min-width:0}

/* Colonnes de la fiche prospect (structure 3 colonnes) */
.fiche-col{min-width:0;display:flex;flex-direction:column;gap:14px}
.fiche-col > div{min-width:0}
.fiche-col--client,.fiche-col--actions{border-right:1px solid var(--line);padding-right:18px}
[data-modal="fiche"] .drawer__body{gap:0 30px}

/* ===== Suivi RDV inline — colonne devis (ex fenêtre « compte-rendu ») ===== */
.suivi{display:flex;flex-direction:column;gap:13px;padding:13px 15px}
.suivi__head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding-bottom:10px;border-bottom:1px dashed var(--line)}
.suivi__head > .label:first-child{font-size:12.5px;letter-spacing:.03em}
.suivi__company{font-family:var(--font-mono);font-size:9.5px!important;letter-spacing:.05em!important;text-transform:none!important;color:var(--grey)!important}
.suivi__col{display:flex;flex-direction:column;gap:13px;min-width:0}
.suivi__choices .btn{padding:4px 11px;font-size:12.5px}
.suivi__next{gap:8px}
.suivi__foot{display:flex;justify-content:flex-end;padding-top:2px}
.suivi .box__row{gap:8px}
.suivi .line-row{padding:8px 11px}
.suivi .line-row__name{flex:1 1 auto}
.suivi .line-total{padding:9px 11px}
.suivi .line-total__value{font-size:17px}
/* note sous Rendez-vous : pointe vers le Suivi RDV intégré à gauche */
.rdv-hint{margin-top:9px}
.rdv-hint .label{color:var(--grey-3)}

/* Pied de fiche — suppression définitive */
.fiche-col--danger{grid-column:1/-1;border-top:1px solid var(--line);padding-top:10px;margin-top:8px}
#fiche-delete{font:inherit;font-size:12px;color:var(--red);background:transparent;border:1px solid currentColor;border-radius:6px;padding:6px 10px;cursor:pointer}
#fiche-delete:hover{background:var(--red);color:#fff}

/* ===== Fiche prospect : panneau « Informations prospect » (coordonnées éditables) ===== */
.prospect-edit{background:var(--paper);border:1px solid var(--line-soft);border-radius:10px;padding:11px 12px 6px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 12px}
.prospect-edit__head{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:1px}
.prospect-edit__head .block__label{margin:0}
.prospect-edit .field{min-width:0}
.prospect-edit .input,.prospect-edit .select,.prospect-edit .textarea{width:100%;box-sizing:border-box;border-radius:6px;padding:7px 9px;font-size:12.5px}
.prospect-edit .textarea{min-height:32px}
.btn--xs{padding:6px 10px;font-size:9px}

/* ===== Récap « Prochaines actions » (carte brief/pitch de l'écran Aujourd'hui) =====
   Liste compacte des suivis à venir (D.nextActions()) : société, libellé, échéance,
   responsable. Compacte pour ne pas casser la hauteur du kpi-row. */
.pitch__list{margin-top:13px;padding-top:10px;border-top:1px solid var(--line);
  display:flex;flex-direction:column;gap:5px;max-height:210px;overflow-y:auto}
.briefa__row{display:flex;align-items:baseline;gap:8px;font-size:12px;line-height:1.45;min-width:0}
.briefa__co{font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:42%}
.briefa__lbl{color:var(--ink-soft);flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.briefa__due{font-family:var(--font-mono);font-size:10.5px;color:var(--grey);white-space:nowrap}
.briefa__owner{font-family:var(--font-mono);font-size:9.5px;font-weight:600;color:var(--blue);
  border:1px solid currentColor;border-radius:4px;padding:0 4px;white-space:nowrap}


/* =AJD rail commission - demande interne 2026-09 */
.ajd-cols{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,1.05fr);gap:22px;align-items:start}
.ajd-col{min-width:0;display:flex;flex-direction:column;gap:12px}
.ajd-col--actions{min-width:0}
.ajd-col--rdv .goal{flex:1 1 auto}
.ajd-col--comm #commission{flex:0 1 auto;max-height:none;overflow:visible}
.ajd-main{min-width:0}
.ajd-aside{position:static;display:flex;flex-direction:column;min-width:0;gap:14px}
/* Le pitch « prochaines actions » passe sous les 3 colonnes, pleine largeur */
@media (max-width:1240px){.ajd-cols{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.ajd-col--comm{grid-column:1/-1}}
@media (max-width:820px){.ajd-cols{grid-template-columns:1fr}}
.ajd-aside{position:static}

/* Badge NOUVEAU — lead venu d'un formulaire du site (moins de 7 jours) */
/* Ruban « NOUVEAU » en diagonale sur la carte (leads du site, < 7 jours).
   Très visible : fond rouge, texte blanc, incliné 45° dans le coin haut-droit. */
.deal__new{
  position:absolute; top:0; right:0; width:76px; height:76px;
  overflow:hidden; pointer-events:none; z-index:2;
}
.deal__new[hidden]{display:none;}
.deal__new::before{
  content:"NEW";
  position:absolute; top:13px; right:-32px; width:120px;
  transform:rotate(45deg); transform-origin:center;
  background:#E8253D; color:#fff;
  font:700 9.5px/1.9 'Archivo',sans-serif; letter-spacing:.11em; text-align:center;
  box-shadow:0 1px 4px rgba(0,0,0,.25);
  animation:dealNewPulse 2.2s ease-in-out infinite;
}
@keyframes dealNewPulse{0%,100%{opacity:1}50%{opacity:.6}}

/* Encart Sous-traitant (fiche prospect) — lignes de devis sous-traités = 1 RDV posé chacune */
#sub-box{margin-top:18px}
.sub__hint{margin:2px 0 10px;color:#8a8a8a;line-height:1.45}
.sub__count{margin-left:auto;color:#2643ff;font-weight:700}
.sub__list{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.sub__empty{color:#9aa0b5;padding:8px 0}
.sub__row{display:flex;align-items:center;gap:10px;border:1px solid #e6e8f2;border-radius:4px;padding:8px 10px;background:#fafbff}
.sub__main{min-width:0;flex:1}
.sub__company{font:600 13px 'Archivo',sans-serif;color:#111;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sub__meta{color:#7a8194}
.sub__del{border:0;background:transparent;color:#c2c6d4;font-size:18px;line-height:1;cursor:pointer;padding:2px 6px;border-radius:3px}
.sub__del:hover{color:#E8253D;background:#fdeef0}
.sub__total{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #e6e8f2;padding-top:8px;margin-top:2px}
.sub__total-amt{font:800 15px 'Archivo Expanded','Archivo',sans-serif;color:#2643ff}
.sub__form{display:grid;grid-template-columns:1.4fr .9fr 1fr auto;gap:8px;align-items:end;border-top:1px solid #e6e8f2;padding-top:12px}
.sub__form .input{width:100%}
.sub__form label{display:flex;flex-direction:column;gap:4px}
@media (max-width:900px){.sub__form{grid-template-columns:1fr 1fr}}
#sub-box[hidden]{display:none !important}

/* ==========================================================================
   Commission « en grand » dans Aujourd'hui (demande interne 2026-09)
   Référence visuelle : le panneau commission du Point hebdo (.comm-line 16px).
   Le rail droit fait 380px : on exploite toute la largeur.
   ========================================================================== */
.ajd-col--comm #commission{
  padding:22px 24px 20px;
  border-left:3px solid var(--blue);
  border-radius:6px;
}
.ajd-col--comm #commission .comm__label{
  font-size:9.5px; letter-spacing:.16em;
}
.ajd-col--comm #commission .comm__total{
  font-size:52px; font-weight:600; letter-spacing:-.045em;
  margin:10px 0 4px;
}
.ajd-col--comm #commission .comm__prev{
  font-size:10px; letter-spacing:.1em; margin-top:0; padding-top:0;
  margin-bottom:18px;
}
.ajd-col--comm #commission .comm__lines{gap:18px;padding-top:16px;max-height:none;overflow:visible}
.ajd-col--comm #commission .comm__grp-title{
  font-size:10px; letter-spacing:.12em; margin-bottom:10px;
}
.ajd-col--comm #commission .comm__grp-row{
  font-size:16px; line-height:1.5;
  padding:9px 0; border-bottom:1px solid #f0f1f7;
}
.ajd-col--comm #commission .comm__grp-row:last-of-type{ border-bottom:0; }
.ajd-col--comm #commission .comm__grp-co{ font-weight:600; color:var(--ink); }
.ajd-col--comm #commission .comm__grp-amt{ font-size:15px; font-weight:600; }
.ajd-col--comm #commission .comm__grp-empty{ font-size:13px; }
.ajd-col--comm #commission .comm__grp-sub{
  margin-top:10px; padding-top:9px; border-top:1px dashed var(--line);
}
.ajd-col--comm #commission .comm__grp-sublabel{ font-size:10px; letter-spacing:.1em; }
.ajd-col--comm #commission .comm__grp-subamt{ font-size:13px; font-weight:600; }
.ajd-col--comm #commission .comm__grp + .comm__grp{ padding-top:16px; }

/* Responsive : si le rail passe sous la colonne principale, on garde le grand format */
@media (max-width:1150px){
  .ajd-col--comm #commission .comm__total{ font-size:44px; }
}

/* Fiche NEW : le badge propriétaire (N / M) est repositionné EN BAS À DROITE.
   On libère le coin haut-droit (occupé par le ruban diagonal) et on ancre l'avatar. */
.deal.is-new { padding-bottom: 30px; }           /* réserve la place en bas */
.deal.is-new .deal__head { padding-right: 62px; } /* évite le ruban en haut à droite */
.deal.is-new .avatar[data-deal-owner]{
  position: absolute; right: 10px; bottom: 8px;
  z-index: 3;
}

/* ==========================================================================
   RÉCAP AUJOURD'HUI — blocs chiffrés
   Colonne 1 de la page Aujourd'hui. Reprend les tokens du thème (--ink,
   --grey, --line, --font-title, --font-mono, --stage-*) pour rester cohérent
   avec les cartes RDV et Commission.

   Convention : BEM .blk pour le conteneur, .blk__x pour les enfants.
   ========================================================================== */

/* ------------------------------------------------------------------ carte --- */
/* une carte de bloc : même respiration que .goal (20/22) */
.blk { padding: 20px 22px; }

/* pied de carte : ligne pointillée + mention discrète (aligné sur .goal__month-list) */
.blk__foot {
  margin-top: 14px;
  padding-top: 11px;
  border-top: 1px solid var(--line-soft);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--grey-2);
}
.card--dark .blk__foot { border-top-color: var(--dark-line); color: var(--grey-3); }

/* état vide : discret, jamais de bloc muet */
.blk__empty {
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--grey);
}

/* ================================================ 1 · PIPELINE PAR ÉTAPE === */
.blk-row {
  display: grid;
  grid-template-columns: 74px 1fr 24px;
  align-items: center;
  gap: 12px;
  padding: 7px 0;
}
.blk-row + .blk-row { border-top: 1px solid var(--line-soft); }

.blk-row__lbl {
  font-family: var(--font-mono);
  font-size: 9.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--grey);
}

/* barre : rail clair + remplissage coloré */
.blk-row__rail {
  height: 6px;
  background: var(--line-soft);
  border-radius: 3px;
  overflow: hidden;
}
.blk-row__fill {
  display: block;
  height: 100%;
  /* minimum 4px : une barre à 5 % doit rester lisible */
  min-width: 4px;
  border-radius: 3px;
  background: var(--stage-contact);
  transition: width 0.45s cubic-bezier(0.22, 0.7, 0.2, 1);
}
.blk-row__fill[data-stage="contact"] { background: var(--stage-contact); }
.blk-row__fill[data-stage="rdv"]     { background: var(--stage-rdv); }
.blk-row__fill[data-stage="devis"]   { background: var(--blue); }
.blk-row__fill[data-stage="signe"]   { background: var(--stage-signe); }
.blk-row__fill[data-stage="perdu"]   { background: var(--stage-perdu); }

.blk-row__n {
  text-align: right;
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--ink);
}

/* ==================================================== 2 · VALEUR EN JEU === */
.blk-val { display: flex; gap: 28px; flex-wrap: wrap; }
.blk-val__col { flex: 1 1 130px; min-width: 0; }

.blk-val__num {
  font-family: var(--font-title);
  font-weight: 800;
  font-size: 25px;
  line-height: 1.1;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  color: var(--ink);
}
.blk-val__num--ok { color: var(--blue); }

.blk-val__cap {
  margin-top: 6px;
  font-family: var(--font-mono);
  font-size: 9.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--grey);
}

/* ================================================== 3 · TAUX DE SIGNATURE === */
/* carte sombre : le chiffre doit ressortir */
.blk-kpi { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; }

.blk-kpi__val {
  font-family: var(--font-title);
  font-weight: 800;
  font-size: 46px;
  line-height: 1;
  letter-spacing: -0.035em;
  font-variant-numeric: tabular-nums;
  color: var(--white);
}

.blk-kpi__cap {
  flex: 1 1 150px;
  max-width: 210px;
  font-size: 11.5px;
  line-height: 1.4;
  color: var(--grey-3);
}

/* ================================================ 4 · FICHES DORMANTES === */
.blk-item {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 14px;
  align-items: baseline;
  padding: 10px 0;
  cursor: pointer;
  border-top: 1px solid var(--line-soft);
}
.blk-item:first-child { border-top: 0; padding-top: 2px; }
.blk-item:hover .blk-item__co { color: var(--blue); }

.blk-item__co {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink);
  transition: color 0.2s ease;
}

.blk-item__meta {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--grey-2);
}

.blk-item__days {
  margin-left: auto;
  font-weight: 600;
  color: var(--red);
}

/* la pastille reste collée au statut ; seul le compteur de jours est poussé */
.blk-item__owner { margin-right: auto; }

/* pastille de propriétaire (N / M) */
.blk-item__owner {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background: var(--paper);
  border: 1px solid var(--line);
  font-size: 9.5px;
  font-weight: 700;
  color: var(--ink-soft);
  letter-spacing: 0;
}

/* ------------------------------------------------- espacement de colonne --- */
/* rythme vertical : 24px entre les blocs, 10px entre le titre et sa carte */
.ajd-col--actions .rule-row { margin-top: 24px; }
.ajd-col--actions .rule-row:first-child { margin-top: 0; }
.ajd-col--actions .rule-row + .card,
.ajd-col--actions .rule-row + .card--dark { margin-top: 10px; }