/* ================================================================
   MASTERSALES — Design System
   Palette Apple-inspired, propre, professionnel, captivant
   ================================================================ */

/* ── 1. Tokens ─────────────────────────────────────────────────── */
:root {
  /* Couleurs de base */
  --bg:            #F5F5F7;
  --surface:       #FFFFFF;
  --surface-2:     #F2F2F7;
  --surface-3:     #E5E5EA;

  /* Texte */
  --text:          #1D1D1F;
  --text-soft:     #6E6E73;
  --text-muted:    #AEAEB2;

  /* Accent principal */
  --accent:        #0071E3;
  --accent-dark:   #0064CA;
  --accent-soft:   rgba(0,113,227,.10);

  /* Semantic */
  --green:         #34C759;
  --green-soft:    rgba(52,199,89,.10);
  --coral:         #FF3B30;
  --coral-soft:    rgba(255,59,48,.10);
  --gold:          #FF9F0A;
  --gold-soft:     rgba(255,159,10,.10);
  --teal:          #32ADE6;
  --teal-soft:     rgba(50,173,230,.10);
  --blue:          #0071E3;
  --blue-soft:     rgba(0,113,227,.10);

  /* Variantes texte accessibles (contraste AA) des couleurs vives ci-dessus,
     utilisées quand la couleur sert de TEXTE (pas de fond) sur fond clair. */
  --coral-text:    #C2342B;
  --green-text:    #15803D;
  --gold-text:     #B45309;

  /* Sidebar */
  --sidebar:       #1C1C1E;
  --sidebar-text:  rgba(255,255,255,.85);
  --sidebar-muted: rgba(255,255,255,.45);

  /* Bordures & ombres */
  --border:        rgba(0,0,0,.07);
  --border-strong: rgba(0,0,0,.14);
  --shadow-sm:     0 1px 4px rgba(0,0,0,.06), 0 4px 12px rgba(0,0,0,.04);
  --shadow-md:     0 2px 8px rgba(0,0,0,.08), 0 8px 24px rgba(0,0,0,.06);
  --shadow-lg:     0 4px 16px rgba(0,0,0,.10), 0 16px 48px rgba(0,0,0,.08);
  --shadow-focus:  0 0 0 3px rgba(0,113,227,.20);

  /* Forme */
  --r-xs: 6px;
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 18px;
  --r-xl: 22px;
  --r-2xl: 28px;
  --r-full: 999px;

  /* Espacement */
  --gap-xs:  4px;
  --gap-sm:  8px;
  --gap-md:  16px;
  --gap-lg:  24px;
  --gap-xl:  32px;
  --gap-2xl: 48px;

  /* Motion */
  --ease:     cubic-bezier(.4,0,.2,1);
  --duration: 160ms;

  /* Typo */
  --font: "SF Pro Display","Helvetica Neue","Segoe UI",sans-serif;

  /* Aliases compatibilité */
  --card:      var(--surface);
  --line:      var(--border);
  --bg-soft:   var(--surface-2);
  --text-soft: #6E6E73;
  --shadow:    var(--shadow-sm);
  --radius-xl: var(--r-xl);
  --radius-lg: var(--r-lg);
  --radius-md: var(--r-md);
  --radius-sm: var(--r-sm);
  --transition: var(--duration) var(--ease);
  --font-sans:  var(--font);
}

/* ── 2. Reset ───────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--font);
  font-size: 15px;
  line-height: 1.5;
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
}

body.modal-open { overflow: hidden; }

button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }

/* Scrollbar fine */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(0,0,0,.18); border-radius: var(--r-full); }
::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,.28); }

/* Focus visible */
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Supprimer les blobs ambiants */
.ambient { display: none !important; }

/* ── 3. Typographie ────────────────────────────────────────────── */
h1, h2, h3, h4, h5 {
  margin: 0;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.15;
}
h1 { font-size: clamp(2rem, 4vw, 3rem); letter-spacing: -0.04em; }
h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); }
h3 { font-size: 1.25rem; }
h4 { font-size: 1.05rem; }
p  { margin: 0; }

.eyebrow {
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.page-note {
  color: var(--text-soft);
  font-size: .9rem;
  line-height: 1.6;
}

/* ── 4. Layout shells ──────────────────────────────────────────── */
.app-shell {
  max-width: 1480px;
  margin: 0 auto;
  padding: var(--gap-xl) var(--gap-lg) var(--gap-2xl);
}





/* Mode immersif */
.sales-immersive-body { overflow-x: hidden; }
.sales-immersive-shell {
  max-width: 1680px;
  margin: 0 auto;
  padding: var(--gap-lg) var(--gap-lg) var(--gap-xl);
  display: grid;
  gap: var(--gap-md);
  min-height: 100vh;
}

/* ── 5. Topbar (workspace) ─────────────────────────────────────── */






.topbar-motto { color: var(--accent); font-size: .82rem; font-weight: 600; }
.topbar-copy  { color: var(--text-soft); font-size: .88rem; }

/* Immersive toolbar */
.sales-immersive-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--gap-md);
  padding: var(--gap-sm) var(--gap-md);
  border-radius: var(--r-xl);
  background: rgba(255,255,255,.92);
  border: 1px solid var(--border);
  box-shadow: var(--shadow-sm);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.sales-immersive-brand,
.sales-immersive-actions {
  display: flex;
  align-items: center;
  gap: var(--gap-sm);
}

.sales-immersive-brand strong { font-size: .95rem; font-weight: 700; letter-spacing: -0.02em; }
.sales-immersive-brand span  { display: block; font-size: .75rem; color: var(--text-soft); }

/* ── 6. Sidebar ────────────────────────────────────────────────── */




.sales-sidebar-logo {
  height: 24px;
  width: auto;
  max-width: 150px;
  object-fit: contain;
  flex-shrink: 0;
}







.sales-side-link,
.sales-side-toggle {
  display: flex;
  align-items: center;
  gap: var(--gap-sm);
  padding: 10px var(--gap-sm);
  border-radius: var(--r-md);
  color: var(--sidebar-text);
  font-size: .88rem;
  font-weight: 500;
  transition: background var(--duration) var(--ease), color var(--duration) var(--ease);
  text-decoration: none;
  border: 0;
  background: transparent;
  width: 100%;
  text-align: left;
  cursor: pointer;
  line-height: 1.3;
}

.sales-side-link:hover,
.sales-side-toggle:hover {
  background: rgba(255,255,255,.08);
  color: #FFFFFF;
}

.sales-side-link.is-active {
  background: var(--accent);
  color: #FFFFFF;
  font-weight: 600;
}

.sales-side-icon {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: var(--r-sm);
  background: rgba(255,255,255,.10);
  font-size: .9rem;
  flex-shrink: 0;
  transition: background var(--duration) var(--ease);
}

.sales-side-link.is-active .sales-side-icon {
  background: rgba(255,255,255,.22);
}

.sales-side-chevron {
  margin-left: auto;
  font-size: .7rem;
  color: rgba(255,255,255,.4);
  transition: transform var(--duration) var(--ease);
}

.sales-side-toggle[aria-expanded="true"] .sales-side-chevron { transform: rotate(180deg); }



.sales-side-sublink {
  display: flex;
  align-items: center;
  gap: var(--gap-xs);
  padding: 8px var(--gap-sm);
  border-radius: var(--r-sm);
  color: rgba(255,255,255,.65);
  font-size: .82rem;
  font-weight: 500;
  text-decoration: none;
  transition: background var(--duration) var(--ease), color var(--duration) var(--ease);
}

.sales-side-sublink:hover { background: rgba(255,255,255,.07); color: #FFF; }
.sales-side-sublink.is-active { background: rgba(0,113,227,.22); color: #FFF; font-weight: 600; }
.sales-side-subicon { font-size: .8rem; }







/* Sélecteur « Ouvrir une autre vue » (SMM omniscient) dans la sidebar */
.view-as-switch {
  margin: var(--gap-sm) var(--gap-md) 0;
  padding-top: var(--gap-sm);
  border-top: 1px solid rgba(255,255,255,.07);
}
.view-as-switch-title {
  display: block;
  color: var(--sidebar-muted);
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.view-as-switch-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
.view-as-switch-form { display: contents; }
.view-as-switch-grid button {
  width: 100%;
  padding: 7px 6px;
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.9);
  border: 0;
  border-radius: 8px;
  font-size: .75rem;
  font-weight: 600;
  cursor: pointer;
  transition: background var(--duration) var(--ease);
}
.view-as-switch-grid button:hover { background: var(--accent); color: #fff; }

/* Bandeau flottant « vue empruntée » — présent sur la vue visitée */
.view-as-banner {
  position: fixed;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 60;
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: min(680px, calc(100vw - 24px));
  padding: 10px 16px;
  background: #10203f;
  color: #fff;
  border-radius: var(--r-full);
  box-shadow: 0 8px 28px rgba(16,32,63,.4);
  font-size: .82rem;
  font-weight: 500;
}
.view-as-dot {
  width: 9px; height: 9px; flex-shrink: 0;
  border-radius: 50%;
  background: var(--coral);
  box-shadow: 0 0 0 4px rgba(255,107,107,.25);
}
.view-as-banner span:not(.view-as-dot) { min-width: 0; }
.view-as-banner button {
  flex-shrink: 0;
  padding: 6px 14px;
  background: #fff;
  color: #10203f;
  border: 0;
  border-radius: var(--r-full);
  font-size: .78rem;
  font-weight: 700;
  cursor: pointer;
  transition: background var(--duration) var(--ease);
}
.view-as-banner button:hover { background: var(--surface-2); }
@media (max-width: 640px) {
  .view-as-banner { font-size: .76rem; padding: 9px 12px; }
}

/* Bouton déconnexion dans la sidebar — couleurs adaptées au fond sombre */




/* ── 7. Cards & Panels ─────────────────────────────────────────── */
.panel,
.hero-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-sm);
  padding: var(--gap-lg);
}

.compact-panel { padding: var(--gap-md); }
.panel-wide { width: 100%; }

.panel-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--gap-md);
  margin-bottom: var(--gap-md);
}

.panel-header.compact { margin-bottom: var(--gap-sm); }

.panel-header h3 {
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  margin: 4px 0 0;
}

.panel-header h4 {
  font-size: .95rem;
  font-weight: 700;
  margin: 3px 0 0;
}

.panel-tag {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 11px;
  border-radius: var(--r-full);
  background: var(--accent-soft);
  color: var(--accent);
  font-size: .78rem;
  font-weight: 700;
  white-space: nowrap;
}

/* Hero cards */
.hero-card { padding: var(--gap-xl); overflow: hidden; position: relative; }

.hero-main {
  background: linear-gradient(135deg, #FFFFFF 0%, #F5F8FF 100%);
}

.hero-side {
  background: linear-gradient(135deg, #FFFFFF 0%, #FFF8F5 100%);
}

.hero-card h2, .hero-card h3 {
  margin: var(--gap-xs) 0 var(--gap-sm);
}

.hero-copy {
  margin: 0;
  color: var(--text-soft);
  line-height: 1.6;
  max-width: 44rem;
}

/* Grid layouts */
.hero-grid {
  display: grid;
  gap: var(--gap-lg);
  grid-template-columns: minmax(0, 1.62fr) minmax(320px, .82fr);
}

.workspace-hero-grid { gap: var(--gap-lg); grid-template-columns: minmax(0, 1.62fr) minmax(340px, .82fr); align-items: start; }
.workspace-metric-grid { gap: var(--gap-sm); }
.workspace-stack { display: grid; gap: var(--gap-lg); }

/* Metric snapshot */
.metric-snapshot-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: var(--gap-sm);
  margin-bottom: var(--gap-md);
}

.metric-snapshot-card {
  display: grid;
  gap: var(--gap-xs);
  padding: var(--gap-md);
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
  background: var(--surface-2);
  position: relative;
  overflow: hidden;
}

.metric-snapshot-card span { color: var(--text-soft); font-size: .8rem; font-weight: 600; letter-spacing: .02em; }
.metric-snapshot-card strong { font-size: 1.35rem; letter-spacing: -0.04em; font-weight: 700; }

/* ── Activité Loïc : mini-graphique 10 jours ──────────────────────
   Ces classes étaient SANS style (orphelines) : la section s'affichait en
   texte brut empilé. Colonnes = jours ouvrés, hauteur de barre = intensité. */
.smm-activity-chart {
  display: grid;
  grid-template-columns: repeat(10, minmax(0, 1fr));
  gap: 8px;
  margin-top: 16px;
  align-items: stretch;
}
.activity-day-card {
  display: flex; flex-direction: column; align-items: center; gap: 7px;
  min-width: 0; padding: 10px 5px;
  border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface);
}
.activity-day-card.is-empty { background: var(--surface-2); }
.activity-day-card.is-today { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.activity-day-head { display: flex; flex-direction: column; align-items: center; line-height: 1.1; text-align: center; }
.activity-day-head span { font-size: .58rem; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); }
.activity-day-head strong { font-size: .76rem; letter-spacing: -.01em; }
.activity-bar-shell {
  width: 26px; height: 88px; display: flex; align-items: flex-end;
  background: var(--surface-2); border-radius: 7px; overflow: hidden;
}
.activity-bar { width: 100%; min-height: 4px; border-radius: 7px 7px 0 0; background: var(--accent); }
.activity-bar.is-output { background: var(--green); }
.activity-bar.is-muted { background: var(--surface-3); }
.activity-day-metrics {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 2px 6px; width: 100%;
  font-size: .6rem; color: var(--text-soft); font-variant-numeric: tabular-nums; text-align: center;
}
.activity-day-metrics span { white-space: nowrap; }
.activity-day-state { font-size: .58rem; color: var(--text-muted); text-align: center; }
.activity-day-card.is-today .activity-day-state { color: var(--accent); font-weight: 700; }
.activity-legend { margin-top: 12px; font-size: .68rem; color: var(--text-muted); }
.activity-legend span { font-weight: 700; color: var(--text-soft); }
@media (max-width: 720px) {
  /* Colonnes trop serrées sur mobile → scroll horizontal. */
  .smm-activity-chart { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 64px; overflow-x: auto; padding-bottom: 4px; }
}

/* ── Accueil SMM : blocs dont les classes étaient orphelines (rendus en texte
   brut). Audit HTML↔CSS de la page d'accueil. ─────────────────────────────── */

/* « Score Loïc » : cartes de qualité (régularité, suivi, conversion…). */
.score-stack {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--gap-sm); margin-top: 14px;
}
.score-card {
  display: flex; flex-direction: column; gap: 8px;
  padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface);
}
.score-card > p { font-size: .78rem; color: var(--text-soft); margin: 0; }
.score-label { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.score-label strong { font-size: .92rem; }
.score-label span { font-size: .74rem; color: var(--text-muted); white-space: nowrap; }

/* « Vue globale terrain » : grille des cartes mission (au lieu d'une colonne). */
.smm-mission-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: var(--gap-sm); margin-top: 14px;
}

/* Objectifs dépliables (Piloter / Orienter) : pastille d'icône + textes. */
.objective-icon {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 9px;
  background: var(--accent-soft); color: var(--accent); font-size: .9rem;
}
.monthly-objective-summary-copy { font-size: .8rem; color: var(--text-soft); margin: 3px 0 0; }
.monthly-objective-content { padding: 4px 2px 2px; display: grid; gap: 12px; }
.monthly-objective-detail { font-size: .8rem; color: var(--text-muted); margin: 0; }

/* Actions d'une priorité (compléter / reporter). */
.priority-task-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

/* ── 8. Boutons ────────────────────────────────────────────────── */
.primary-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--gap-xs);
  padding: 11px 22px;
  background: var(--accent);
  color: #FFFFFF;
  border: 0;
  border-radius: var(--r-full);
  font-size: .9rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  cursor: pointer;
  transition: background var(--duration) var(--ease), transform 80ms var(--ease);
  white-space: nowrap;
  text-decoration: none;
}

.primary-button:hover { background: var(--accent-dark); }
.primary-button:active { transform: scale(.97); }
.primary-button:disabled { opacity: .5; cursor: not-allowed; transform: none; }

.secondary-button {
  display: inline-flex;
  align-items: center;
  gap: var(--gap-xs);
  padding: 10px 18px;
  background: var(--surface-2);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: var(--r-full);
  font-size: .88rem;
  font-weight: 600;
  cursor: pointer;
  transition: background var(--duration) var(--ease);
  text-decoration: none;
  white-space: nowrap;
}

.secondary-button:hover { background: var(--surface-3); }

.ghost-button,
.notification-button {
  display: inline-flex;
  align-items: center;
  gap: var(--gap-xs);
  padding: 8px 14px;
  background: rgba(0,0,0,.06);
  color: var(--text);
  border: 0;
  border-radius: var(--r-full);
  font-size: .84rem;
  font-weight: 600;
  cursor: pointer;
  transition: background var(--duration) var(--ease);
  text-decoration: none;
  white-space: nowrap;
}

.ghost-button:hover, .notification-button:hover { background: rgba(0,0,0,.10); }
.ghost-button.icon-button { padding: 8px 10px; }

.inline-form { display: inline; }

/* Notification badge */
.notification-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  background: var(--coral);
  color: #FFF;
  border-radius: var(--r-full);
  font-size: .7rem;
  font-weight: 700;
}

/* ── 9. Formulaires ────────────────────────────────────────────── */
.form-field, .field {
  display: grid;
  gap: 6px;
}

.form-label, .field label, label.form-label {
  font-size: .8rem;
  font-weight: 700;
  color: var(--text-soft);
  letter-spacing: .02em;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="range"]):not([type="file"]),
select,
textarea {
  width: 100%;
  padding: 10px 14px;
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: var(--r-sm);
  color: var(--text);
  font: inherit;
  font-size: .9rem;
  transition: border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease);
}

input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="range"]):not([type="file"]):focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: var(--shadow-focus);
}

textarea { resize: vertical; min-height: 80px; }

select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236E6E73' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 36px;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: var(--gap-sm);
}
.form-actions { display: flex; gap: var(--gap-sm); align-items: center; padding-top: 4px; }

table {
  width: 100%;
  border-collapse: collapse;
  font-size: .88rem;
}

th {
  padding: 10px 16px;
  background: var(--surface-2);
  text-align: left;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--text-soft);
  border-bottom: 1px solid var(--border);
}

td {
  padding: 12px 16px;
  border-bottom: 1px solid rgba(0,0,0,.04);
  vertical-align: middle;
}

tr:last-child td { border-bottom: none; }
tr:hover td { background: rgba(0,0,0,.02); }

/* ── 11. Notifications / Flash ─────────────────────────────────── */
.summary-banner {
  display: flex;
  gap: var(--gap-sm);
  align-items: flex-start;
  padding: var(--gap-sm) var(--gap-md);
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--accent);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-sm);
  margin-bottom: var(--gap-md);
  font-size: .88rem;
}

.summary-banner strong { font-weight: 700; white-space: nowrap; }
.summary-banner p { color: var(--text-soft); margin: 0; }

.notification-drawer {
  position: sticky;
  top: var(--gap-lg);
  z-index: 3;
  width: min(380px, 100%);
  /* Jamais plus haut que l'écran : la liste défile à l'intérieur du bloc,
     le bouton Notifications et la croix de fermeture restent accessibles. */
  max-height: min(72vh, 680px);
  margin-left: auto;
  margin-bottom: var(--gap-lg);
  padding: var(--gap-lg);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-lg);
  display: none;
}

.notification-drawer.open { display: flex; flex-direction: column; animation: rise 200ms var(--ease); }
.notification-drawer[aria-hidden="true"] { display: none !important; }

.drawer-header { display: flex; justify-content: space-between; gap: var(--gap-md); align-items: center; margin-bottom: var(--gap-md); flex-shrink: 0; }
.drawer-list { display: grid; gap: var(--gap-xs); overflow-y: auto; min-height: 0; overscroll-behavior: contain; }

/* Composeur « envoyer une notification push à un collègue » (tiroir bureau) */
.push-composer {
  flex-shrink: 0;
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  background: var(--surface-2);
  padding: var(--gap-sm) var(--gap-md);
  margin-bottom: var(--gap-md);
  display: grid;
  gap: 8px;
}
.push-enable-btn {
  width: 100%;
  border: 0;
  border-radius: var(--r-md);
  background: var(--accent);
  color: #fff;
  padding: 9px 12px;
  font-size: .82rem;
  font-weight: 700;
  cursor: pointer;
}
.push-enable-btn:hover { filter: brightness(1.07); }
.push-field { display: grid; gap: 4px; font-size: .72rem; font-weight: 700; color: var(--text-soft); text-transform: uppercase; letter-spacing: .03em; }
.push-field select { text-transform: none; font-weight: 500; letter-spacing: 0; }
.push-send-row { display: flex; gap: 6px; }
.push-send-row input { flex: 1; min-width: 0; }
.push-send-btn {
  flex-shrink: 0;
  border: 0;
  border-radius: var(--r-md);
  background: var(--text);
  color: var(--surface);
  padding: 0 16px;
  font-size: .82rem;
  font-weight: 700;
  cursor: pointer;
}
.push-send-btn:hover { background: var(--accent); color: #fff; }
.push-hint { margin: 0; font-size: .68rem; color: var(--text-muted); }
/* Composeur sur la page planning (pas de tiroir) : petite carte en haut à droite */
/* Icône « bulle » du planning (style Odoo) : le composeur de notification se
   replie dans un menu déroulant de la barre du haut. */
.pg-push-menu { position: relative; }
.pg-push-menu > summary {
  list-style: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  color: rgba(255, 255, 255, .85);
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
}
.pg-push-menu > summary::-webkit-details-marker { display: none; }
.pg-push-menu > summary:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.pg-push-menu[open] > summary { background: rgba(255, 255, 255, .18); color: #fff; }
.pg-push-drop {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 60;
  width: min(340px, calc(100vw - 24px));
  background: #fff;
  color: var(--ink, #16233a);
  border-radius: 12px;
  border: 1px solid rgba(15, 33, 55, .12);
  box-shadow: 0 14px 34px rgba(10, 42, 57, .22);
  padding: 14px;
}
.pg-push-drop .push-composer { margin: 0; }

.drawer-close {
  flex-shrink: 0;
  align-self: flex-start;
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,.06);
  color: var(--text-soft);
  border: 0;
  border-radius: var(--r-full);
  font-size: .95rem;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: background var(--duration) var(--ease), color var(--duration) var(--ease);
}
.drawer-close:hover { background: rgba(0,0,0,.12); color: var(--text); }

.notification-item {
  display: flex;
  align-items: flex-start;
  gap: var(--gap-sm);
  padding: var(--gap-sm) var(--gap-md);
  border-radius: var(--r-sm);
  background: var(--surface-2);
  transition: opacity .2s ease, transform .2s ease;
}
.notification-body { flex: 1 1 auto; min-width: 0; }
.notification-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  padding: 6px 12px;
  border-radius: var(--r-sm);
  background: var(--accent);
  color: #fff;
  font-size: .82rem;
  font-weight: 600;
  text-decoration: none;
  transition: background .15s ease, transform .15s ease;
}
.notification-cta:hover { background: var(--accent-strong, var(--accent)); transform: translateY(-1px); }
.notification-cta:active { transform: translateY(0); }
.notification-item.is-removing { opacity: 0; transform: translateX(12px); }
.notification-validate {
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: .95rem;
  font-weight: 700;
  cursor: pointer;
  transition: background .15s ease, transform .15s ease;
}
.notification-validate:hover { background: var(--accent); color: #fff; transform: scale(1.05); }
.notification-validate:active { transform: scale(.95); }
.notification-count.is-empty { display: none; }

/* ── 12. Badges / Chips ────────────────────────────────────────── */
.crm-chip, .panel-tag, .channel-badge,
.processing-pill, .objective-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border-radius: var(--r-full);
  padding: 5px 11px;
  font-size: .78rem;
  font-weight: 700;
  white-space: nowrap;
}

.crm-chip         { background: var(--accent-soft); color: var(--accent); }
.crm-chip.subtle  { background: rgba(0,0,0,.07); color: var(--text-soft); }
.crm-chip.danger  { background: var(--coral-soft); color: var(--coral); }

/* Tones */
.tone-teal   { background: var(--teal-soft);  color: var(--teal); }
.tone-blue   { background: var(--blue-soft);   color: var(--blue); }
.tone-coral  { background: var(--coral-soft);  color: var(--coral); }
.tone-gold   { background: var(--gold-soft);   color: var(--gold); }
.tone-green  { background: var(--green-soft);  color: var(--green); }

/* Status badges */
.status-badge          { display: inline-block; padding: 4px 10px; border-radius: var(--r-full); font-size: .76rem; font-weight: 700; }
.status-badge.active,
.status-badge.validated  { background: var(--green-soft); color: var(--green); }
.status-badge.pending    { background: var(--gold-soft);  color: var(--gold); }
.status-badge.danger     { background: var(--coral-soft); color: var(--coral); }

/* ── 13. Animations ────────────────────────────────────────────── */
@keyframes fade {
  from { opacity: 0; transform: translateY(5px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes rise {
  from { opacity: 0; transform: translateY(8px) scale(.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes slideIn {
  from { opacity: 0; transform: translateX(-8px); }
  to   { opacity: 1; transform: translateX(0); }
}

.view { display: none; gap: var(--gap-lg); }
.view.active { display: grid; animation: fade 200ms var(--ease); }

/* ── 14. Utility ───────────────────────────────────────────────── */
.split { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(300px, .82fr); gap: var(--gap-lg); align-items: start; }
.empty-state { text-align: center; padding: var(--gap-2xl); color: var(--text-soft); }

/* ── 15. Login ─────────────────────────────────────────────────── */

/* Corps login */
.login-body {
  margin: 0;
  min-height: 100vh;
  background: var(--bg);
  display: grid;
  place-items: center;
  padding: var(--gap-xl);
}

/* Conteneur centré */
.login-center {
  width: 100%;
  max-width: 640px;
  margin-inline: auto;
  display: grid;
  gap: 0;
}

.login-title {
  font-size: clamp(2.4rem, 5vw, 3.6rem);
  font-weight: 800;
  letter-spacing: -0.05em;
  color: var(--text);
  margin: 0 0 var(--gap-xl);
  text-align: center;
}

.login-subtitle {
  font-size: 1rem;
  font-weight: 600;
  color: var(--text-soft);
  letter-spacing: 0;
  margin: 0 0 var(--gap-md);
  text-align: center;
}

/* Grille profils — version 2 */
.login-access-grid-v2 {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: var(--gap-sm);
  margin-bottom: var(--gap-xl);
}

/* Cartes profil */
.login-access-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--gap-xs);
  padding: var(--gap-md) var(--gap-sm);
  border: 1.5px solid var(--border);
  border-radius: var(--r-xl);
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
  overflow: hidden;
  min-height: 100px;
  text-align: center;
  transition: border-color 140ms var(--ease),
              box-shadow 140ms var(--ease),
              transform 100ms var(--ease),
              background 140ms var(--ease);
}

.login-access-card:hover,
.login-access-card:focus-visible {
  border-color: rgba(0,113,227,.35);
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
  outline: none;
}

/* Animations de sélection */
@keyframes card-select {
  0%   { transform: scale(1); }
  35%  { transform: scale(1.07); }
  65%  { transform: scale(.98); }
  100% { transform: scale(1); }
}

@keyframes icon-bounce {
  0%   { transform: translateY(0) scale(1); }
  30%  { transform: translateY(-6px) scale(1.12); }
  60%  { transform: translateY(-2px) scale(.96); }
  80%  { transform: translateY(-4px) scale(1.04); }
  100% { transform: translateY(0) scale(1); }
}

@keyframes glow-pulse {
  0%   { box-shadow: 0 0 0 3px rgba(0,113,227,.12); }
  50%  { box-shadow: 0 0 0 6px rgba(0,113,227,.08), 0 0 18px rgba(0,113,227,.12); }
  100% { box-shadow: 0 0 0 3px rgba(0,113,227,.12); }
}

.login-access-card.is-selected,
.login-access-card:has(.login-access-radio:checked) {
  border-color: var(--accent);
  background: var(--surface);
  box-shadow: 0 0 0 3px rgba(0,113,227,.12);
  animation: card-select 380ms cubic-bezier(.34,1.56,.64,1), glow-pulse 600ms ease 200ms;
}

.login-access-icon {
  display: grid;
  place-items: center;
  width: 44px; height: 44px;
  border-radius: var(--r-md);
  background: var(--surface-2);
  color: var(--accent);
  font-size: 1.25rem;
  line-height: 1;
  transition: background 140ms var(--ease);
}

.login-access-card.is-selected .login-access-icon,
.login-access-card:has(.login-access-radio:checked) .login-access-icon {
  background: var(--accent-soft);
  animation: icon-bounce 420ms cubic-bezier(.34,1.56,.64,1);
}

.login-access-copy strong {
  font-size: .82rem;
  font-weight: 700;
  line-height: 1.2;
  display: block;
}

/* Petit écran : on garde les 6 vues sur UNE ligne mais on compacte tout et on
   laisse les libellés s'enrouler (au lieu d'être tronqués). */
@media (max-width: 560px) {
  .login-access-grid-v2 { gap: 5px; }
  .login-access-card { padding: 10px 3px; min-height: 74px; border-radius: var(--r-lg); gap: 5px; }
  .login-access-icon { width: 30px; height: 30px; font-size: .95rem; }
  .login-access-copy strong { font-size: .58rem; line-height: 1.1; overflow-wrap: anywhere; hyphens: auto; }
}

/* Bloc mot de passe + bouton */
.login-password-block {
  display: flex;
  gap: var(--gap-sm);
  align-items: center;
}

.login-password-wrap {
  flex: 1;
  position: relative;
  display: flex;
  align-items: center;
}

.login-password-input {
  flex: 1;
  width: 100%;
  padding: 14px 48px 14px 18px;
  background: var(--surface);
  border: 1.5px solid var(--border-strong);
  border-radius: var(--r-lg);
  color: var(--text);
  font: inherit;
  font-size: 1rem;
  transition: border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease);
}

.login-password-input::placeholder { color: var(--text-muted); }

.login-password-input:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: var(--shadow-focus);
}

.login-eye {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 0;
  background: transparent;
  color: var(--text-muted);
  border-radius: var(--r-sm);
  cursor: pointer;
  transition: color var(--duration) var(--ease), background var(--duration) var(--ease);
}
.login-eye:hover { color: var(--accent); background: var(--accent-soft); }

.login-submit-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--gap-sm);
  padding: 14px 24px;
  background: var(--accent);
  color: #FFFFFF;
  border: 0;
  border-radius: var(--r-lg);
  font: inherit;
  font-size: .95rem;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--duration) var(--ease), transform 80ms var(--ease);
  flex-shrink: 0;
}

.login-submit-btn:hover { background: var(--accent-dark); }
.login-submit-btn:active { transform: scale(.97); }
.login-submit-arrow { font-size: 1.1rem; transition: transform 140ms var(--ease); }
.login-submit-btn:hover .login-submit-arrow { transform: translateX(3px); }

/* Logo en tête des écrans d'accès */
.login-logo { height: 48px; width: auto; margin: 0 auto var(--gap-md); display: block; }

/* Page d'aiguillage « Êtes-vous… » */
.access-chooser { max-width: 560px; }
.access-chooser .login-title { margin-bottom: var(--gap-xs); }
.access-chooser .login-subtitle { margin-bottom: var(--gap-lg); }
.access-choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap-md); }
.access-choice-card {
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px;
  padding: 34px 22px; border: 1.5px solid var(--border); border-radius: var(--r-xl);
  background: var(--surface); color: var(--text); text-decoration: none;
  transition: border-color 140ms var(--ease), box-shadow 160ms var(--ease), transform 120ms var(--ease);
}
.access-choice-card:hover, .access-choice-card:focus-visible {
  border-color: rgba(0,113,227,.4); box-shadow: 0 18px 44px rgba(0,0,0,.10); transform: translateY(-3px); outline: none;
}
.access-choice-icon {
  width: 74px; height: 74px; border-radius: 50%; display: grid; place-items: center;
  background: var(--accent-soft); color: var(--accent); margin-bottom: 4px;
  transition: background 140ms var(--ease), color 140ms var(--ease);
}
.access-choice-icon svg { width: 38px; height: 38px; }
.access-choice-card:hover .access-choice-icon { background: var(--accent); color: #fff; }
.access-choice-card strong { font-size: 1.2rem; letter-spacing: -.02em; }
.access-choice-card > span:last-child { font-size: .8rem; color: var(--text-soft); line-height: 1.4; }
@media (max-width: 520px) {
  .access-choice-grid { grid-template-columns: 1fr; }
  .access-choice-card { flex-direction: row; text-align: left; gap: 16px; padding: 20px 18px; }
  .access-choice-icon { width: 56px; height: 56px; margin-bottom: 0; flex: 0 0 auto; }
  .access-choice-icon svg { width: 28px; height: 28px; }
}
.brand-title-row { display: flex; align-items: center; gap: var(--gap-md); margin-bottom: var(--gap-md); }
.brand-logo { height: 34px; width: auto; object-fit: contain; flex-shrink: 0; }
.login-form { display: grid; gap: var(--gap-md); margin-top: var(--gap-lg); }

.sales-command-panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
}

.sales-command-main { padding: var(--gap-xl); }
.sales-command-side {
  padding: var(--gap-lg);
  background: var(--surface-2);
  border-left: 1px solid var(--border);
  display: grid;
  gap: var(--gap-md);
  align-content: start;
}

.sales-command-list { display: grid; gap: var(--gap-sm); }

.sales-command-item {
  display: flex;
  align-items: center;
  gap: var(--gap-sm);
  padding: var(--gap-sm) var(--gap-md);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  transition: box-shadow var(--duration) var(--ease);
}

.sales-command-item:hover { box-shadow: var(--shadow-sm); }

.sales-command-cta { display: block; text-align: center; padding: 14px; }

.task-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: var(--gap-md);
  transition: box-shadow var(--duration) var(--ease);
}

.task-card:hover { box-shadow: var(--shadow-sm); }
.task-icon {
  width: 36px; height: 36px;
  display: grid; place-items: center;
  border-radius: var(--r-sm);
  background: var(--surface-2);
  border: 1px solid var(--border);
  font-size: 1rem;
  flex-shrink: 0;
}
.task-time {
  display: inline-block;
  padding: 3px 8px;
  background: var(--blue-soft);
  color: var(--accent);
  border-radius: var(--r-full);
  font-size: .74rem;
  font-weight: 700;
}

.sales-progress-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--gap-sm);
}

.sales-progress-card {
  display: grid;
  gap: var(--gap-xs);
  padding: var(--gap-md);
  border-radius: var(--r-lg);
  background: var(--surface);
  border: 1px solid var(--border);
  overflow: hidden;
  position: relative;
}

.sales-progress-card.is-good   { border-color: rgba(52,199,89,.22); }
.sales-progress-card.is-warn   { border-color: rgba(255,159,10,.22); }
.sales-progress-card.is-critical { border-color: rgba(255,59,48,.22); }

.sales-progress-card.is-link { color: inherit; text-decoration: none; cursor: pointer; transition: border-color .15s var(--ease), box-shadow .15s var(--ease), transform .15s var(--ease); }
.sales-progress-card.is-link:hover { border-color: var(--accent); box-shadow: var(--shadow-sm); transform: translateY(-2px); }
.sales-progress-card.is-link:focus-visible { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.sales-progress-go { position: absolute; top: 10px; right: 12px; color: var(--text-muted); font-size: 1.05rem; font-weight: 700; line-height: 1; opacity: 0; transform: translateX(-3px); transition: opacity .15s var(--ease), transform .15s var(--ease), color .15s var(--ease); }
.sales-progress-card.is-link:hover .sales-progress-go, .sales-progress-card.is-link:focus-visible .sales-progress-go { opacity: 1; transform: none; color: var(--accent); }

.sales-mini-day-grid { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 8px; }
.sales-week-note { margin: 0 0 10px; font-size: .78rem; color: var(--text-soft); }
.sales-mini-day {
  display: grid; gap: 2px; justify-items: center; text-align: center;
  padding: 10px 6px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
}
.sales-mini-day strong { font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--text-soft); }
.sales-mini-date { font-size: .64rem; color: var(--text-muted); }
.sales-mini-count { font-size: 1.5rem; font-weight: 700; letter-spacing: -.03em; line-height: 1.1; color: var(--text); }
.sales-mini-tag { font-size: .6rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; padding: 1px 7px; border-radius: var(--r-full); }
/* Couleur selon la charge */
.sales-mini-day.load-light .sales-mini-tag { background: var(--surface-2); color: var(--text-muted); }
.sales-mini-day.load-ok    .sales-mini-tag { background: rgba(52,199,89,.14); color: var(--green-text); }
.sales-mini-day.load-warn  .sales-mini-tag { background: var(--gold-soft); color: var(--gold-text); }
.sales-mini-day.load-alert .sales-mini-tag { background: rgba(255,59,48,.12); color: var(--coral-text); }
.sales-mini-day.load-warn  { border-color: rgba(255,159,10,.3); }
.sales-mini-day.load-alert { border-color: rgba(255,59,48,.3); }
.sales-mini-day.is-today { border-color: var(--accent); box-shadow: 0 0 0 2px rgba(0,113,227,.14); }
.sales-mini-day.is-today strong { color: var(--accent); }
.sales-mini-late { font-size: .58rem; font-weight: 600; color: var(--coral-text); margin-top: 1px; }

.sales-admin-alerts {
  padding: var(--gap-sm) var(--gap-md);
  background: var(--coral-soft);
  border: 1px solid rgba(255,59,48,.2);
  border-radius: var(--r-md);
  font-size: .85rem;
}

.routine-list { display: grid; gap: var(--gap-sm); }
.routine-item {
  display: flex;
  align-items: center;
  gap: var(--gap-sm);
  padding: var(--gap-sm) var(--gap-md);
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  cursor: grab;
  user-select: none;
  transition: box-shadow var(--duration) var(--ease);
}
.routine-item:hover { box-shadow: var(--shadow-sm); }
.routine-item.is-dragging { opacity: .5; }
.routine-item.drop-target { border-color: rgba(0,113,227,.35); box-shadow: 0 0 0 2px var(--accent-soft); }
.routine-badge {
  padding: 3px 9px;
  background: var(--accent);
  color: #FFF;
  border-radius: var(--r-full);
  font-size: .72rem;
  font-weight: 700;
}
.sales-closeout-panel { display: grid; gap: var(--gap-md); }

.sales-closeout-topline {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: var(--gap-sm);
}

.sales-closeout-metric {
  display: grid;
  gap: var(--gap-xs);
  padding: var(--gap-sm) var(--gap-md);
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
}

.sales-closeout-metric span { color: var(--text-soft); font-size: .8rem; }
.sales-closeout-metric strong { font-size: 1.1rem; letter-spacing: -0.03em; }
.sales-closeout-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: var(--gap-md); }
.sales-closeout-form textarea { min-height: 130px; resize: vertical; }

/* CRM > Activités : pile pleine largeur — Priorités actives (avec contexte intégré) puis File du jour */
.crm-activities-stack { display: flex; flex-direction: column; gap: var(--gap-lg); width: 100%; }

/* Contexte utile, intégré en tête du panneau « priorités actives » */
.crm-context-strip { margin: 0 0 var(--gap-lg); padding: 0 0 var(--gap-md); border-bottom: 1px solid var(--border); }
.crm-context-strip-empty { border-bottom: 1px dashed var(--border); }
.crm-context-strip-head { display: flex; flex-wrap: wrap; gap: var(--gap-md); align-items: flex-start; justify-content: space-between; }
.crm-context-strip-head h3 { margin: 2px 0 0; }
.crm-context-metrics { display: flex; gap: 8px; flex-wrap: wrap; }
.crm-context-strip-tools { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.crm-context-metric { display: inline-flex; flex-direction: column; gap: 1px; padding: 6px 12px; background: var(--surface-2); border-radius: var(--r-md); }
.crm-context-metric small { font-size: .58rem; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); }
.crm-context-metric strong { font-size: .82rem; }
.crm-context-cols { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--gap-md); margin-top: var(--gap-md); }
.crm-context-cols > section > strong { display: block; font-size: .66rem; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); margin-bottom: 8px; }
.crm-context-trace-list { display: flex; flex-direction: column; gap: 8px; }
.crm-context-trace { padding: 9px 11px; background: var(--surface-2); border-radius: var(--r-md); border-left: 3px solid var(--border); }
.crm-context-trace.is-alert { border-left-color: var(--coral); }
.crm-context-trace strong { font-size: .8rem; display: block; }
.crm-context-trace p { font-size: .74rem; color: var(--text-soft); margin: 2px 0 0; }
/* Note d'appel libre (report « à recontacter ») — mise en avant, en italique */
.crm-context-trace-note { font-style: italic; color: var(--text) !important; margin: 4px 0 0 !important; white-space: pre-wrap; }
.crm-context-trace span { font-size: .64rem; color: var(--text-muted); }

/* File du jour : pleine largeur, épurée, en grille 2 colonnes */
.crm-focus-session-panel-wide .panel-header { display: flex; align-items: center; justify-content: space-between; gap: var(--gap-md); flex-wrap: wrap; }
.crm-focus-session-summary { display: flex; gap: 8px; }
.crm-focus-session-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--gap-sm); margin-top: var(--gap-sm); }
.crm-focus-session-row { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); text-decoration: none; color: inherit; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.crm-focus-session-row:hover { border-color: var(--accent); box-shadow: 0 4px 14px rgba(0,0,0,.06); transform: translateY(-1px); }
.crm-focus-session-row.is-active { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.crm-focus-order-badge { flex: 0 0 auto; width: 24px; height: 24px; border-radius: 50%; background: var(--accent-soft); color: var(--accent); font-size: .72rem; font-weight: 700; display: grid; place-items: center; }
.crm-focus-session-copy { flex: 1 1 auto; min-width: 0; }
.crm-focus-session-copy strong { display: block; font-size: .86rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-focus-session-copy p { font-size: .72rem; color: var(--text-soft); margin: 2px 0 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-focus-session-due { flex: 0 0 auto; font-size: .68rem; font-weight: 600; color: var(--text-muted); white-space: nowrap; }
.crm-focus-session-due.is-late { color: var(--coral); }
.crm-focus-session-due.is-today { color: var(--warning, #d98a00); }
.crm-focus-session-go { flex: 0 0 auto; color: var(--text-muted); font-style: normal; font-size: 1.15rem; line-height: 1; }
/* En-tête de groupe dans la file (En retard / Aujourd'hui / À venir) : occupe
   toute la largeur de la grille 2 colonnes, teinte selon l'urgence. */
.crm-focus-session-group { grid-column: 1 / -1; margin: 8px 0 2px; font-size: .64rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted); }
.crm-focus-session-group.is-late { color: var(--coral-text, var(--coral)); }
.crm-focus-session-group.is-today { color: var(--warning, #d98a00); }
.crm-focus-session-row.is-collapsed { display: none; }
/* « X affichés sur N — voir tout » : déroule les lignes masquées d'un groupe. */
.crm-focus-session-toggle {
  grid-column: 1 / -1; justify-self: start; margin: 2px 0 0;
  background: none; border: none; padding: 4px 2px; cursor: pointer;
  font-size: .74rem; font-weight: 600; color: var(--accent); text-decoration: underline;
}
.crm-focus-session-toggle:hover { color: var(--accent-strong, var(--accent)); }
.crm-focus-mode-metric.is-late strong { color: var(--coral-text, var(--coral)); }
/* Cadre « Prochain appel » à part, sous la file : la fiche que la boucle focus
   enchaîne (toujours un retard tant qu'il en reste). */
.crm-focus-next-card {
  margin-top: var(--gap-md); display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 14px 16px; border: 1px solid var(--border); border-left: 3px solid var(--accent);
  border-radius: var(--r-md); background: var(--surface-2);
}
.crm-focus-next-card.is-late { border-left-color: var(--coral); }
.crm-focus-next-card.is-ok { border-left-color: var(--success, #1a7f45); }
.crm-focus-next-copy { flex: 1 1 auto; min-width: 0; display: grid; gap: 2px; }
.crm-focus-next-copy .eyebrow { font-size: .64rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--text-muted); }
.crm-focus-next-copy strong { font-size: 1rem; font-weight: 700; letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-focus-next-copy p { margin: 0; font-size: .8rem; color: var(--text-soft); }
.crm-focus-next-tag { flex: 0 0 auto; font-size: .7rem; font-weight: 700; color: var(--text-muted); background: var(--surface); border: 1px solid var(--border); padding: 4px 10px; border-radius: var(--r-full); }
.crm-focus-next-tag.is-late { color: var(--coral-text, var(--coral)); border-color: var(--coral); }
.crm-focus-next-tag.is-ok { color: var(--success, #1a7f45); border-color: var(--success, #1a7f45); }
.crm-focus-next-cta { flex: 0 0 auto; padding: 10px 18px; }
/* Badge « Prochaine fiche » du panneau de commande : reflète le statut retard. */
.crm-activity-command-badge.is-late { color: var(--coral-text, var(--coral)); background: rgba(255,59,48,.12); }
.crm-activity-command-badge.is-ok { color: var(--success, #1a7f45); background: rgba(26,127,69,.12); }

.crm-activity-command-panel,
.crm-command-panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}

/* Panneau de commande « Aujourd'hui tu appelles » — layout 2 colonnes + padding */
.crm-activity-command-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  align-items: stretch;
}
.crm-activity-command-main {
  padding: var(--gap-xl);
  min-width: 0;
  display: grid;
  gap: var(--gap-sm);
  align-content: start;
}
.crm-activity-command-main h2 { font-size: 1.55rem; letter-spacing: -.03em; margin: 2px 0 6px; }
.crm-activity-command-item {
  display: grid; gap: 1px;
  padding: 10px 14px;
  background: var(--surface-2);
  border-radius: var(--r-md);
}
.crm-activity-command-item strong { font-size: .9rem; font-weight: 650; color: var(--text); }
.crm-activity-command-item span { font-size: .78rem; color: var(--text-soft); }
.crm-activity-command-side {
  padding: var(--gap-lg);
  background: var(--surface-2);
  border-left: 1px solid var(--border);
  display: grid;
  gap: var(--gap-md);
  align-content: start;
}
.crm-activity-command-focus { display: grid; gap: 4px; }
.crm-activity-command-badge {
  justify-self: start;
  font-size: .64rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
  color: var(--accent); background: var(--accent-soft);
  padding: 3px 10px; border-radius: var(--r-full);
}
.crm-activity-command-focus strong { font-size: 1.05rem; font-weight: 700; letter-spacing: -.01em; }
.crm-activity-command-focus p { margin: 0; font-size: .82rem; color: var(--text-soft); line-height: 1.4; }
.crm-activity-command-kpis {
  display: flex; flex-wrap: wrap; gap: 6px 16px;
  font-size: .78rem; color: var(--text-soft);
}
.crm-activity-command-cta { display: block; text-align: center; padding: 13px; }

@media (max-width: 900px) {
  .crm-activity-command-panel { grid-template-columns: 1fr; }
  .crm-activity-command-main { padding: var(--gap-lg); }
  .crm-activity-command-side { border-left: 0; border-top: 1px solid var(--border); }
}

.sales-command-panel { overflow: hidden; }

.crm-activity-command-list,
.sales-command-list {
  display: grid;
  gap: var(--gap-xs);
}

/* Pipeline */
.crm-pipeline-board { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: var(--gap-sm); align-items: start; }

.crm-pipeline-column {
  padding: var(--gap-md);
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  min-height: 200px;
}

.crm-pipeline-column.compact { min-height: auto; }

.crm-pipeline-head {
  display: flex;
  align-items: center;
  gap: var(--gap-sm);
  padding-bottom: var(--gap-sm);
  border-bottom: 1px solid var(--border);
  margin-bottom: var(--gap-sm);
}

.crm-pipeline-list { display: grid; gap: var(--gap-xs); }

.crm-entity-card {
  padding: var(--gap-sm) var(--gap-md);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  cursor: pointer;
  transition: box-shadow var(--duration) var(--ease), border-color var(--duration) var(--ease);
  display: grid;
  gap: 4px;
}

.crm-entity-card:hover { box-shadow: var(--shadow-sm); border-color: rgba(0,113,227,.2); }
.crm-entity-card p { margin: 0; color: var(--text-soft); font-size: .82rem; }

/* Overdue */
.crm-overdue-list { display: grid; gap: var(--gap-xs); }
.crm-overdue-row {
  display: flex;
  gap: var(--gap-sm);
  align-items: center;
  padding: var(--gap-xs) var(--gap-sm);
  border-radius: var(--r-sm);
}
.crm-overdue-row p { margin: 0; color: var(--text-soft); font-size: .82rem; }
.crm-entity-card-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }

/* Pistes — liste scannable (refonte) */
.crm-leads-workspace { display: grid; gap: var(--gap-md); }

.crm-leads-toolbar { display: flex; align-items: center; gap: var(--gap-sm); flex-wrap: wrap; padding: var(--gap-sm) var(--gap-md); }
.crm-leads-search { position: relative; display: flex; align-items: center; flex: 1 1 260px; min-width: 220px; }
.crm-leads-search-icon { position: absolute; left: 12px; color: var(--text-soft); font-size: 1rem; pointer-events: none; }
.crm-leads-search input { width: 100%; padding: 10px 12px 10px 34px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface-2); color: var(--text); font: inherit; transition: border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease), background var(--duration) var(--ease); }
.crm-leads-search input:focus { outline: none; border-color: var(--accent); background: var(--surface); box-shadow: 0 0 0 3px var(--accent-soft); }
.crm-leads-search-reset { margin: 8px 2px 0; font-size: .82rem; }
.crm-leads-search-reset a { color: var(--accent); text-decoration: none; }
.crm-leads-search-reset a:hover { text-decoration: underline; }

/* Doublons à fusionner (Lot 2). */
.crm-duplicates-panel { border-left: 3px solid var(--warning, #d98a00); }
.crm-dup-group { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 10px 0; border-top: 1px solid var(--border); }
.crm-dup-members { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; flex: 1 1 320px; min-width: 260px; }
.crm-dup-member { font-size: .84rem; color: var(--text-soft); }
.crm-dup-member.is-keep { color: var(--text); font-weight: 600; }
.crm-dup-member strong { font-weight: 650; }
.crm-dup-stage { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--text-muted); }

.crm-leads-filters { display: flex; gap: 6px; flex-wrap: wrap; }
.crm-filter-chip { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: var(--text-soft); font-size: .82rem; font-weight: 600; cursor: pointer; transition: color var(--duration) var(--ease), background var(--duration) var(--ease), border-color var(--duration) var(--ease); }
.crm-filter-chip span { background: var(--surface-3); color: var(--text-soft); border-radius: 999px; padding: 1px 7px; font-size: .72rem; line-height: 1.5; }
.crm-filter-chip:hover { border-color: var(--accent); color: var(--text); }
.crm-filter-chip.is-active { background: var(--accent); border-color: var(--accent); color: #fff; }
.crm-filter-chip.is-active span { background: rgba(255,255,255,.24); color: #fff; }

.crm-leads-toolbar-actions { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.crm-leads-toolbar-actions .inline-form { margin: 0; }
[data-crm-toggle].is-active { background: var(--accent); color: #fff; border-color: var(--accent); }

.crm-new-lead-shell[hidden], .crm-leads-empty-search[hidden] { display: none; }
.crm-new-lead-shell .crm-form-panel { margin: 0; }

.crm-leads-list-group { display: grid; gap: var(--gap-xs); }
.crm-leads-group-head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; padding: 0 4px 2px; }
.crm-leads-group-head h3 { margin: 0; font-size: 1.02rem; }
.crm-leads-group-note { margin: 0; flex: 1 1 100%; color: var(--text-soft); font-size: .8rem; }
.crm-count-pill { background: var(--surface-3); color: var(--text-soft); border-radius: 999px; padding: 2px 9px; font-size: .78rem; font-weight: 700; }

.crm-leads-table { display: grid; gap: 6px; }
.crm-leads-row { display: grid; grid-template-columns: 14px minmax(0,2.4fr) minmax(130px,1fr) minmax(120px,1fr) auto; grid-template-areas: "dot id phone next action"; align-items: center; gap: var(--gap-md); padding: 11px var(--gap-md); background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-md); transition: border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease); }
.crm-lead-row:hover { border-color: rgba(0,113,227,.28); box-shadow: var(--shadow-sm); }
/* Ligne entièrement cliquable (ouvre la fiche) — les liens internes gardent leur rôle */
.crm-lead-row[data-crm-row-link] { cursor: pointer; }
.crm-lead-row[data-crm-row-link]:focus-visible { outline: 2px solid rgba(0,113,227,.5); outline-offset: 2px; }
.crm-leads-row-head { background: transparent; border: none; padding: 2px var(--gap-md) 0; box-shadow: none; }
.crm-leads-row-head:hover { box-shadow: none; border: none; }
.crm-leads-row-head span { font-size: .7rem; text-transform: uppercase; letter-spacing: .04em; color: var(--text-soft); font-weight: 700; }

.crm-lead-dot { grid-area: dot; width: 10px; height: 10px; border-radius: 50%; box-sizing: border-box; }
.crm-lead-dot.is-ready { background: var(--green); }
.crm-lead-dot.is-partial { background: var(--gold); }
.crm-lead-dot.is-empty { background: transparent; border: 2px solid var(--coral); }

.crm-lead-identity { grid-area: id; min-width: 0; }
.crm-lead-company { display: block; font-weight: 650; color: var(--text); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-lead-company:hover { color: var(--accent); text-decoration: underline; }
.crm-lead-sub { margin: 2px 0 0; font-size: .8rem; color: var(--text-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.crm-lead-phone-cell { grid-area: phone; min-width: 0; }
.crm-lead-phone { color: var(--text); font-size: .88rem; text-decoration: none; font-variant-numeric: tabular-nums; }
.crm-lead-phone:hover { color: var(--accent); }
.crm-lead-phone.is-missing { color: var(--coral-text); font-size: .8rem; }

.crm-lead-next-cell { grid-area: next; min-width: 0; }
.crm-lead-next { font-size: .82rem; color: var(--text-soft); }
.crm-lead-next.is-overdue { color: var(--coral-text); font-weight: 600; }
.crm-lead-next.is-none { color: var(--text-soft); opacity: .65; }

.crm-lead-actions { grid-area: action; display: flex; justify-content: flex-end; }
.crm-lead-action { display: inline-flex; align-items: center; white-space: nowrap; padding: 7px 14px; border-radius: var(--r-md); background: var(--accent-soft); color: var(--accent); font-weight: 650; font-size: .84rem; text-decoration: none; transition: background var(--duration) var(--ease), color var(--duration) var(--ease); }
.crm-lead-action:hover { background: var(--accent); color: #fff; }

.crm-leads-empty-search { padding: var(--gap-lg); text-align: center; }

@media (max-width: 720px) {
  .crm-leads-toolbar-actions { margin-left: 0; width: 100%; }
  .crm-leads-row { grid-template-columns: 14px 1fr auto; grid-template-areas: "dot id action" "dot phone action" "dot next action"; row-gap: 3px; column-gap: var(--gap-sm); align-items: start; }
  .crm-lead-dot { align-self: center; }
  .crm-lead-actions { align-self: center; }
  .crm-leads-row-head { display: none; }
}

/* Focus / CRM workspace */
.crm-focus-mode-banner {
  padding: var(--gap-md) var(--gap-lg);
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  display: flex;
  align-items: center;
  gap: var(--gap-md);
  flex-wrap: wrap;
}

.crm-focus-mode-banner.is-live {
  background: var(--accent-soft);
  border-color: rgba(0,113,227,.18);
}

.crm-focus-mode-metric {
  padding: var(--gap-xs) var(--gap-sm);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
}

.crm-focus-stepbar {
  display: grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: var(--gap-sm);
}

.crm-focus-call-card {
  padding: var(--gap-md);
  background: var(--accent-soft);
  border: 1px solid rgba(0,113,227,.14);
  border-radius: var(--r-lg);
}
/* Numéro cliquable dans la carte d'appel (un tap = dialer). */
.crm-focus-tel { color: var(--accent); font-weight: 700; text-decoration: none; }
.crm-focus-tel:hover { text-decoration: underline; }
.crm-focus-tel.is-missing { color: var(--text-muted); font-weight: 500; }

.crm-focus-context-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: var(--gap-md);
  box-shadow: var(--shadow-sm);
}
.crm-report-command-panel { padding: var(--gap-xl); background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-xl); }
.crm-report-verdict-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: var(--gap-sm); }
.crm-report-objective-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--gap-sm); }
.crm-script-verbatim { padding: 10px 12px; background: var(--surface-2); border-radius: var(--r-md); border-left: 3px solid var(--border); }
.crm-script-verbatim.is-positive { border-left-color: var(--green); }
.crm-script-verbatim.is-alert { border-left-color: var(--coral); }
.crm-script-verbatim-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.crm-script-verbatim-head strong { font-size: .82rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-script-verbatim-head span { font-size: .62rem; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; color: var(--text-muted); flex: 0 0 auto; }
.crm-script-verbatim p { font-size: .78rem; color: var(--text-soft); margin: 4px 0 0; font-style: italic; line-height: 1.4; }

.crm-report-card {
  padding: var(--gap-md);
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
}

.crm-report-card span { color: var(--text-soft); font-size: .82rem; }
.crm-report-card strong { font-size: 1.45rem; letter-spacing: -0.04em; display: block; margin-top: 4px; }
.crm-report-card p { margin: 0; color: var(--text-soft); }

.crm-report-verdict-card { padding: var(--gap-md); background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--r-lg); }
.crm-report-verdict-card > div { display: flex; align-items: center; gap: var(--gap-sm); }
.crm-pipeline-summary-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px,1fr)); gap: var(--gap-sm); }
.crm-pipeline-summary-grid .crm-report-card { padding: 12px 14px; }
.crm-pipeline-summary-grid .crm-report-card strong { font-size: 1.5rem; margin-top: 2px; }
.crm-pipeline-summary-grid .crm-report-card span { font-size: .68rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--text-muted); }
.crm-pipeline-summary-grid .crm-report-card p { font-size: .74rem; }
.crm-pipeline-summary-grid .crm-report-card.is-alert { background: var(--gold-soft); border-color: rgba(255,159,10,.25); }
.crm-report-objective-head { display: flex; align-items: center; gap: var(--gap-sm); justify-content: space-between; margin-bottom: var(--gap-sm); }

/* ===== Rapport CRM — refonte (où j'en suis / où ça coince / où j'excelle / régularité) ===== */
.crm-report-dashboard { display: flex; flex-direction: column; gap: var(--gap-lg); }
.crm-report-two-column { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--gap-lg); align-items: start; }
.crm-report-subpanel { display: flex; flex-direction: column; }
.crm-report-command-panel .crm-report-week-panel,
.crm-report-command-panel .crm-report-objective-grid { margin-top: var(--gap-md); }
.crm-report-command-panel .crm-report-week-panel { padding: 0; background: none; border: 0; box-shadow: none; }

/* Verdict cards (KPIs « où j'en suis ») */
.crm-report-verdict-card span { font-size: .64rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--text-muted); }
.crm-report-verdict-card strong { font-size: 1.4rem; letter-spacing: -.03em; }
.crm-report-verdict-card p { margin: 6px 0 4px; font-size: .76rem; color: var(--text-soft); }
.crm-report-verdict-card em { font-size: .6rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; font-style: normal; color: var(--text-muted); }
.crm-report-verdict-card.is-ok    { border-color: rgba(52,199,89,.32); }
.crm-report-verdict-card.is-ok em    { color: var(--green-text); }
.crm-report-verdict-card.is-watch { border-color: rgba(255,159,10,.32); }
.crm-report-verdict-card.is-watch em { color: var(--gold-text); }
.crm-report-verdict-card.is-alert { border-color: rgba(255,59,48,.32); }
.crm-report-verdict-card.is-alert em { color: var(--coral-text); }

/* Objectifs de la semaine */
.crm-report-objective-card { padding: var(--gap-md); background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--r-lg); }
.crm-report-objective-card span { font-size: .64rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--text-muted); }
.crm-report-objective-card strong { display: block; font-size: 1.1rem; }
.crm-report-objective-card em { font-size: .58rem; font-weight: 700; text-transform: uppercase; font-style: normal; color: var(--text-muted); }
.crm-report-objective-card p { margin: 6px 0 0; font-size: .72rem; color: var(--text-soft); }
.crm-report-objective-card.is-ok    em { color: var(--green-text); }
.crm-report-objective-card.is-watch em { color: var(--gold-text); }
.crm-report-objective-card.is-alert em { color: var(--coral-text); }

/* Lignes de diagnostic (coince / excelle) */
.crm-report-diag-list { display: flex; flex-direction: column; gap: var(--gap-sm); }
.crm-report-diag-row { display: flex; align-items: center; gap: 12px; padding: 11px 13px; background: var(--surface-2); border-radius: var(--r-md); border-left: 3px solid var(--border); text-decoration: none; color: inherit; }
a.crm-report-diag-row { transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
a.crm-report-diag-row:hover { box-shadow: 0 4px 14px rgba(0,0,0,.06); transform: translateY(-1px); }
.crm-report-diag-dot { flex: 0 0 auto; width: 9px; height: 9px; border-radius: 50%; background: var(--text-muted); }
.crm-report-diag-row.is-ok    { border-left-color: var(--green); }
.crm-report-diag-row.is-ok    .crm-report-diag-dot { background: var(--green); }
.crm-report-diag-row.is-watch { border-left-color: var(--gold, var(--gold)); }
.crm-report-diag-row.is-watch .crm-report-diag-dot { background: var(--gold, var(--gold)); }
.crm-report-diag-row.is-alert { border-left-color: var(--coral); }
.crm-report-diag-row.is-alert .crm-report-diag-dot { background: var(--coral); }
.crm-report-diag-copy { flex: 1 1 auto; min-width: 0; }
.crm-report-diag-copy strong { display: block; font-size: .84rem; }
.crm-report-diag-copy p { margin: 2px 0 0; font-size: .74rem; color: var(--text-soft); }
.crm-report-diag-go { flex: 0 0 auto; color: var(--text-muted); font-size: 1.15rem; line-height: 1; }
.crm-report-verbatim-zone { margin-top: var(--gap-md); display: flex; flex-direction: column; gap: var(--gap-sm); }
.crm-report-verbatim-zone .section-inline-title { font-size: .64rem; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); }

/* Régularité — graphe de cadence */
.crm-report-reg-verdict { font-size: .64rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 4px 11px; border-radius: var(--r-full); }
.crm-report-reg-verdict.is-ok    { background: rgba(52,199,89,.14); color: var(--green-text); }
.crm-report-reg-verdict.is-watch { background: var(--gold-soft); color: var(--gold-text); }
.crm-report-reg-verdict.is-alert { background: rgba(255,59,48,.12); color: var(--coral-text); }
.crm-report-reg-summary { display: flex; gap: var(--gap-sm); margin: var(--gap-sm) 0 var(--gap-md); }
.crm-report-reg-metric { display: flex; flex-direction: column; gap: 2px; padding: 8px 14px; background: var(--surface-2); border-radius: var(--r-md); }
.crm-report-reg-metric span { font-size: .6rem; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); }
.crm-report-reg-metric strong { font-size: 1rem; }
.crm-cadence-chart { display: flex; align-items: flex-end; gap: 6px; padding: 6px 0 2px; }
.crm-cadence-col { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; }
.crm-cadence-bar-track { height: 92px; width: 100%; max-width: 34px; display: flex; align-items: flex-end; background: var(--surface-2); border-radius: 6px; overflow: hidden; }
.crm-cadence-bar { width: 100%; min-height: 4px; background: var(--accent); border-radius: 6px 6px 0 0; transition: height .3s ease; }
.crm-cadence-col.is-empty .crm-cadence-bar { background: var(--border); }
.crm-cadence-col.is-today .crm-cadence-bar { background: var(--accent); box-shadow: 0 0 0 2px rgba(0,113,227,.18); }
.crm-cadence-day { font-size: .64rem; font-weight: 600; color: var(--text-soft); }
.crm-cadence-date { font-size: .56rem; color: var(--text-muted); }
.crm-cadence-col.is-today .crm-cadence-day { color: var(--accent); font-weight: 700; }

.crm-report-command-panel .eyebrow,
.crm-report-command-panel h2 { margin-bottom: var(--gap-md); }

/* ── 18. SMM Dashboard ─────────────────────────────────────────── */
.smm-hero-grid { grid-template-columns: minmax(0,1.45fr) minmax(280px,.78fr); }
.smm-priority-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--gap-md); }
.smm-safety-doc-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--gap-sm); }

.smm-pulse-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0,1fr));
  gap: var(--gap-sm);
}

.smm-pulse-card {
  display: grid;
  gap: var(--gap-xs);
  padding: var(--gap-md);
  border-radius: var(--r-lg);
  background: var(--surface-2);
  border: 1px solid var(--border);
  overflow: hidden;
}

.smm-pulse-card p { margin: 0; }
.smm-pulse-card strong { font-size: 1.55rem; letter-spacing: -0.05em; font-weight: 700; }
.smm-pulse-card p:last-child { color: var(--text-soft); line-height: 1.5; font-size: .82rem; }

/* Suppress old decorative blobs */
.smm-pulse-card::after,
.smm-pulse-card::before,
.metric-snapshot-card::after,
.metric-snapshot-card::before,
.monthly-objective-summary::before,
.sales-command-item::after,
.sales-command-item::before,
.sales-progress-card::after,
.sales-progress-card::before {
  content: none !important;
}

body[data-page="smm"] .smm-pulse-card::after,
body[data-page="smm"] .smm-pulse-card:nth-child(2n)::after,
body[data-page="smm"] .smm-pulse-card:nth-child(3n)::after,
body[data-page="smm"] .smm-pulse-card::before {
  content: none !important;
}

.smm-weekly-action-grid { display: grid; gap: var(--gap-sm); }

.smm-subpanel {
  display: grid;
  gap: var(--gap-sm);
  padding: var(--gap-md);
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
  background: var(--surface-2);
}

.smm-decision-hub,
.smm-commercial-risk-panel,
.smm-closeout-panel { display: grid; gap: var(--gap-md); }

.smm-decision-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: var(--gap-sm); }
.smm-risk-grid { display: grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap: var(--gap-sm); }

.smm-decision-card,
.smm-risk-card,
.smm-closeout-row {
  display: grid;
  gap: var(--gap-xs);
  padding: var(--gap-md);
  border-radius: var(--r-lg);
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: var(--shadow-sm);
}

.smm-decision-card strong,
.smm-risk-card strong { font-size: 1.35rem; letter-spacing: -0.04em; font-weight: 700; }

.smm-decision-card span,
.smm-risk-card span,
.smm-risk-overdue { color: var(--text-soft); font-size: .8rem; }

.smm-decision-card p,
.smm-risk-card p { margin: 0; }

.smm-risk-card.is-critical { background: var(--coral-soft); border-color: rgba(255,59,48,.18); }
.smm-risk-card.is-warn     { background: var(--gold-soft);  border-color: rgba(255,159,10,.2); }
.smm-risk-card.is-good     { background: var(--green-soft); border-color: rgba(52,199,89,.18); }

.smm-risk-row {
  display: flex;
  align-items: center;
  gap: var(--gap-sm);
  padding: var(--gap-xs) var(--gap-sm);
  border-radius: var(--r-sm);
  background: var(--surface);
  border: 1px solid var(--border);
  font-size: .85rem;
}

.monthly-objective-stack { display: grid; gap: var(--gap-sm); }
.monthly-objective-item { border: 1px solid var(--border); border-radius: var(--r-lg); overflow: hidden; }

.monthly-objective-summary {
  display: flex;
  align-items: center;
  gap: var(--gap-sm);
  padding: var(--gap-sm) var(--gap-md);
  list-style: none;
  cursor: pointer;
  font-weight: 600;
}

.monthly-objective-summary::after {
  content: "+";
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 32px; height: 32px;
  border-radius: var(--r-md);
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 1.1rem;
  font-weight: 700;
  margin-left: auto;
  transition: background var(--duration) var(--ease);
}

.monthly-objective-item[open] .monthly-objective-summary::after {
  content: "−";
  background: var(--surface-3);
  color: var(--text-soft);
}

.monthly-objective-summary-main { display: flex; gap: var(--gap-sm); align-items: center; }
.monthly-objective-form { padding: 0; border: 0; border-radius: 0; background: transparent; }
.smm-priority-hub { display: grid; gap: var(--gap-md); }

/* ── 19. Missions ──────────────────────────────────────────────── */
.mission-hero-grid { align-items: stretch; grid-template-columns: minmax(0,2fr) minmax(320px,1fr); }
.mission-workspace { display: grid; gap: var(--gap-lg); }
/* Fiche vierge masquée derrière un bouton « Nouvelle mission » (révélation animée, pleine largeur) */
.mission-reveal { width: 100%; }
.mission-new-trigger {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  margin: 0 auto; padding: 14px 30px; border: 0; cursor: pointer;
  background: var(--accent); color: #fff; font-size: .95rem; font-weight: 700;
  border-radius: var(--r-full); box-shadow: 0 8px 22px rgba(0,113,227,.28);
  transition: transform .18s ease, box-shadow .18s ease, opacity .25s ease, background .18s ease;
}
.mission-new-trigger:hover { transform: translateY(-1px); box-shadow: 0 12px 28px rgba(0,113,227,.34); background: var(--accent-strong, #0a66c9); }
.mission-new-trigger:active { transform: translateY(0); }
.mission-new-trigger-plus { font-size: 1.25rem; line-height: 1; font-weight: 400; }
.mission-reveal-body {
  display: grid; grid-template-rows: 0fr;
  transition: grid-template-rows .42s cubic-bezier(.22,.61,.36,1);
}
.mission-reveal-inner { overflow: hidden; min-height: 0; opacity: 0; transform: translateY(-6px); transition: opacity .35s ease .08s, transform .35s ease .08s; }
.mission-reveal.is-open .mission-reveal-body { grid-template-rows: 1fr; }
.mission-reveal.is-open .mission-reveal-inner { opacity: 1; transform: none; }
.mission-reveal.is-open .mission-new-trigger { display: none; }
.mission-reveal .mission-form-panel { margin-top: var(--gap-md); }

/* Consultation RH d'une mission (lecture seule) */
.mission-readonly-banner { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; padding: 10px 14px; border-radius: var(--r-md); background: var(--accent-soft); border-left: 3px solid var(--accent); }
.mission-readonly-banner strong { color: var(--accent); font-size: .85rem; }
.mission-readonly-banner span { font-size: .8rem; color: var(--text-soft); }
.mission-ro-lock { border: 0; padding: 0; margin: 0; min-width: 0; display: block; }
.mission-ro-lock :disabled { opacity: 1; cursor: default; }
.mission-ro-lock input:disabled,
.mission-ro-lock select:disabled,
.mission-ro-lock textarea:disabled { color: var(--text); -webkit-text-fill-color: var(--text); background: var(--surface-2); }
.mission-ro-lock button:disabled,
.mission-ro-lock .primary-button:disabled,
.mission-ro-lock .secondary-button:disabled { opacity: .45; }
.mission-pulse-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: var(--gap-sm); margin-top: var(--gap-md); }
.mission-handoff-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: var(--gap-sm); }
.mission-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--gap-sm); }
.mission-form-grid-details { align-items: start; }

.mission-list { display: grid; gap: var(--gap-sm); }
/* Bloc « Suivi » pleine largeur (fusion, 2026-07-20) : les cartes missions
   s'écoulent en plusieurs colonnes sur grand écran, une seule sur mobile. */
.mission-tracking-panel .mission-list { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }

.mission-list-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  overflow: hidden;
  transition: box-shadow var(--duration) var(--ease), border-color var(--duration) var(--ease);
}

.mission-list-card:hover { box-shadow: var(--shadow-md); border-color: rgba(0,113,227,.15); }
.mission-list-card header { padding: var(--gap-md) var(--gap-lg); display: flex; align-items: center; gap: var(--gap-md); }

.mission-filter-card {
  display: grid;
  gap: var(--gap-xs);
  padding: var(--gap-md);
  border-radius: var(--r-lg);
  background: var(--surface-2);
  border: 1px solid var(--border);
  cursor: pointer;
  transition: border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease);
  /* Tuile = <button> : neutraliser l'apparence native, garder l'alignement carte */
  font: inherit; color: inherit; text-align: left; width: 100%; -webkit-appearance: none; appearance: none;
}
/* Espace harmonieux entre les 4 tuiles-filtres et la liste dépliée (Thomas 2026-07-20) */
.mission-tracking-hint { margin: var(--gap-lg) 0 0; font-size: .82rem; color: var(--text-soft); text-align: center; }
.mission-list--collapsible { margin-top: var(--gap-lg); padding-top: var(--gap-lg); border-top: 1px solid var(--border); animation: fade .16s ease; }
.mission-list-empty-note { grid-column: 1 / -1; margin: var(--gap-sm) 0; color: var(--text-soft); font-size: .9rem; }

.mission-filter-card:hover { border-color: rgba(0,113,227,.22); box-shadow: var(--shadow-sm); }
.mission-filter-card.is-active { border-color: var(--accent); background: var(--accent-soft); }

.mission-side-card { display: grid; gap: var(--gap-md); }
.mission-side-header { display: flex; align-items: center; gap: var(--gap-sm); }
.mission-side-header h3 { font-size: 1.05rem; }

.mission-pulse-card {
  display: grid;
  gap: var(--gap-xs);
  padding: var(--gap-md);
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
}

/* Step track */
.mission-step-track { position: relative; min-height: 76px; padding-top: 4px; }
.mission-step-line, .mission-step-fill {
  position: absolute;
  top: 21px; left: 5%; right: 5%;
  height: 4px;
  border-radius: var(--r-full);
}
.mission-step-line { background: rgba(0,0,0,.08); }
.mission-step-fill { right: auto; width: 0; max-width: 90%; background: var(--accent); transition: width 300ms var(--ease); }
.mission-step-points { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(8, minmax(0,1fr)); gap: var(--gap-sm); }
.mission-step-dot { display: grid; justify-items: center; gap: var(--gap-xs); min-width: 0; color: var(--text-soft); font-size: .7rem; font-weight: 700; line-height: 1.15; text-align: center; }
.mission-step-checkbox { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.mission-step-marker {
  width: 40px; height: 40px;
  display: grid; place-items: center;
  border: 0;
  border-radius: 50%;
  background: #93BEF8;          /* bleu clair : étape à compléter */
  color: #FFFFFF;               /* icône SVG blanche (currentColor) */
  transition: background .2s var(--ease), box-shadow .2s var(--ease), transform .12s var(--ease);
}
.mission-step-marker svg { display: block; }
.mission-step-dot.is-complete { color: var(--accent); }
.mission-step-dot.is-complete .mission-step-marker {
  background: var(--accent);   /* bleu foncé : étape validée (comme les boutons) */
  color: #FFFFFF;
  box-shadow: 0 4px 12px rgba(0,113,227,.3);
}
.mission-step-label { overflow-wrap: anywhere; }
.mission-send-button { background: var(--accent); }

/* Technician picker */
.mission-technician-picker {
  grid-column: 1 / -1;
  display: grid; gap: var(--gap-sm);
  padding: var(--gap-sm);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  background: var(--surface-2);
}
.mission-technician-grid { display: grid; gap: var(--gap-sm); }
.mission-technician-row { display: grid; grid-template-columns: minmax(0,1fr) minmax(200px,.7fr); gap: var(--gap-sm); align-items: end; }
.mission-technician-field { min-width: 0; }

/* Autocomplete */
.mission-autocomplete-menu {
  display: grid; gap: var(--gap-xs);
  max-height: 220px; overflow: auto;
  padding: var(--gap-xs);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  box-shadow: var(--shadow-lg);
}
.mission-autocomplete-menu[hidden] { display: none; }
.mission-autocomplete-menu button {
  width: 100%; border: 0; border-radius: var(--r-sm);
  padding: var(--gap-xs) var(--gap-sm);
  background: transparent; color: var(--text);
  text-align: left; font: inherit; font-weight: 600; cursor: pointer;
  transition: background var(--duration) var(--ease);
}
.mission-autocomplete-menu button:hover,
.mission-autocomplete-menu button:focus { background: var(--accent-soft); outline: none; }

/* Mission handoff */
.mission-summary-card { display: grid; gap: var(--gap-sm); }
.mission-summary-export { background: var(--accent-soft); border: 1px solid rgba(0,113,227,.12); border-radius: var(--r-lg); padding: var(--gap-md); }
.mission-summary-list { display: grid; gap: var(--gap-xs); }
.mission-summary-list p { margin: 0; font-size: .88rem; }

.mission-readiness-score { display: flex; align-items: baseline; gap: var(--gap-xs); }
.mission-readiness-score strong { font-size: 1.35rem; letter-spacing: -0.05em; }
.mission-readiness-score span,
.mission-send-note { color: var(--text-soft); font-size: .82rem; font-weight: 700; }

.mission-readiness-actions .page-note { max-width: 520px; }

/* Barrière bon de commande : mission modifiée après l'envoi du bon → à renvoyer. */
.mission-resend-alert {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 12px 14px; margin-bottom: 14px;
  border-radius: var(--r-md);
  background: color-mix(in srgb, var(--warning, #d98a00) 12%, var(--surface));
  border-left: 3px solid var(--warning, #d98a00);
}
.mission-resend-icon { font-size: 1.05rem; line-height: 1.2; color: var(--warning, #d98a00); }
.mission-resend-alert strong { display: block; color: var(--warning, #d98a00); font-size: .9rem; }
.mission-resend-alert span { display: block; font-size: .82rem; color: var(--text-soft); margin-top: 2px; }
.mission-resend-button { background: var(--warning, #d98a00); border-color: var(--warning, #d98a00); }

/* Channel badge */
.channel-badge { background: rgba(0,0,0,.07); color: var(--text-soft); }
.rh-technician-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px,1fr)); gap: var(--gap-sm); }

/* Orbe completion */
.rh-completion-orb {
  display: grid;
  place-items: center;
  width: 60px; height: 60px;
  border-radius: var(--r-full);
  background: conic-gradient(var(--accent) calc(var(--score, 0) * 1%), var(--surface-3) 0%);
  font-size: .82rem;
  font-weight: 700;
  position: relative;
}
.rh-completion-orb::after {
  content: "";
  position: absolute;
  inset: 5px;
  border-radius: var(--r-full);
  background: var(--surface);
}
.rh-completion-orb strong, .rh-completion-orb span { position: relative; z-index: 1; }

/* Carrousel hier / aujourd'hui / demain (fiche technicien) — façon dates de vol */
.rh-planning-carousel { display: grid; grid-template-columns: 1fr 1.25fr 1fr; gap: 8px; margin: 4px 0 2px; }
.rh-planning-day {
  padding: 10px 8px; border-radius: var(--r-md); background: var(--surface-2);
  border: 1px solid var(--border); text-align: center; display: grid; gap: 3px;
  align-content: start; opacity: .72; transform: scale(.95); transition: opacity var(--duration) var(--ease), transform var(--duration) var(--ease);
}
.rh-planning-day.is-today { background: var(--accent-soft); border-color: rgba(0,113,227,.3); opacity: 1; transform: scale(1); }
.rh-planning-day-label { font-size: .64rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); }
.rh-planning-day.is-today .rh-planning-day-label { color: var(--accent); }
.rh-planning-day-date { font-size: .74rem; color: var(--text-soft); font-weight: 600; }
.rh-planning-day-clients { display: flex; flex-direction: column; gap: 2px; margin-top: 3px; }
.rh-planning-day-clients span { font-size: .8rem; font-weight: 700; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rh-planning-day.is-today .rh-planning-day-clients span { color: var(--accent-dark); }
.rh-planning-day-empty { font-size: .7rem; color: var(--text-muted); font-weight: 500; font-style: italic; }

/* RH rating */
.rh-rating-stars { display: flex; gap: 4px; }

/* Contract timeline */
.rh-contract-timeline {
  display: grid;
  gap: var(--gap-xs);
  padding: var(--gap-sm) var(--gap-md);
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
}

.rh-contract-choice-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: var(--gap-sm); }
.rh-contract-upload-form,
.rh-contract-wizard { padding: var(--gap-lg); }

/* Calendar RH */
.rh-calendar { display: grid; gap: var(--gap-sm); }

/* ── 22. Planning Gantt ────────────────────────────────────────── */

/* Variables */
:root {
  --planning-label-w: 200px;
  --planning-cell-w:  32px;
  --planning-row-h:   40px;
  --planning-header-h: 50px;
  --planning-color-confirmed:  #4A90D9;
  --planning-color-validated:  var(--green);
  --planning-color-proposal:   var(--gold);
  --planning-color-received:   #32ADE6;
  --planning-color-encoded:    #9B59B6;
  --planning-color-conflict:   var(--coral);
  --planning-color-sick:       #B0BEC5;
  --planning-color-leave:      #FFB74D;
  --planning-color-undefined:  #78909C;
}

.planning-day-head.is-weekend         { background: #f0f0f0; }
.planning-day-head.is-weekend strong  { color: #bbb; }
.planning-day-head.is-today           { background: #e8f0fc; }
.planning-day-head.is-today strong    { color: var(--accent); }
.planning-tech-row.drop-target { background: #eef4ff; }
.planning-day-cell.is-weekend { background: #f7f7f7; cursor: default; }
.planning-day-cell.is-today   { background: rgba(0,113,227,.04); }
.planning-day-cell.is-active  { background: rgba(52,199,89,.04); }

/* ── Blocs d'affectation — positionnés par grid-column ─── */
.planning-assignment {
  /* grid-column: start / end défini en inline style par le Python */
  grid-row: 1;
  align-self: stretch;
  margin: 3px 2px;
  border-radius: var(--r-sm);
  padding: 3px 8px;
  font-size: .72rem;
  font-weight: 700;
  color: #FFF;
  cursor: grab;
  overflow: hidden;
  user-select: none;
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
  box-shadow: none;
  transition: opacity 100ms, transform 80ms;
  z-index: 2;
  position: relative;
}

.planning-assignment:active { cursor: grabbing; transform: scaleY(.95); }
.planning-assignment:hover  { opacity: .88; z-index: 10; }

/* Couleurs par statut (conformes Odoo) */
.planning-assignment[data-status="confirmed"],
.planning-assignment[data-status="planning-ok"]  { background: var(--planning-color-confirmed); }
.planning-assignment[data-status="validated"]     { background: var(--planning-color-validated); }
.planning-assignment[data-status="proposal"]      { background: var(--planning-color-proposal); }
.planning-assignment[data-status="received"],
.planning-assignment[data-status="recu"]          { background: var(--planning-color-received); }
.planning-assignment[data-status="encoded"]       { background: var(--planning-color-encoded); }
.planning-assignment[data-status="conflict"]      { background: var(--planning-color-conflict); }
.planning-assignment.is-mission                   { background: var(--planning-color-confirmed); }
.planning-assignment.is-conflict                  { background: var(--planning-color-conflict); }
.planning-assignment.is-open                      { background: #78909C; }

/* Rayures "PAS RECU" / non confirmé */
.planning-assignment[data-status="not-received"],
.planning-assignment.is-not-received {
  background: repeating-linear-gradient(
    -45deg,
    rgba(255,59,48,.85),
    rgba(255,59,48,.85) 4px,
    rgba(255,59,48,.55) 4px,
    rgba(255,59,48,.55) 8px
  );
}

/* Rayures maladie */
.planning-assignment[data-status="sick"],
.planning-assignment.is-sick {
  background: repeating-linear-gradient(
    -45deg,
    #78909C,
    #78909C 4px,
    #90A4AE 4px,
    #90A4AE 8px
  );
}

/* Positionné par grid-column */
.planning-assignment {
  grid-row: 1;
}
.planning-assignment:hover .planning-resize-handle { opacity: 1; }

.rh-validation-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--gap-sm);
  flex-wrap: wrap;
  margin: var(--gap-sm) 0;
  padding: 10px 12px;
  border: 1px solid var(--warning, #d98a00);
  border-radius: var(--r-sm);
  background: color-mix(in srgb, var(--warning, #d98a00) 10%, var(--surface));
  font-size: .82rem;
}

/* ── 23. Workspace hero ────────────────────────────────────────── */
.workspace-page-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, .82fr);
  gap: var(--gap-lg);
  padding: var(--gap-xl);
  border-radius: var(--r-2xl);
  overflow: hidden;
  border: 1px solid var(--border);
  box-shadow: var(--shadow-sm);
  background: var(--surface);
}

.workspace-page-hero > * { position: relative; z-index: 1; }

.workspace-page-hero-main { align-content: start; gap: var(--gap-lg); display: grid; }
.workspace-page-hero-side { display: grid; gap: var(--gap-sm); align-content: space-between; }
.workspace-page-hero-copy { display: grid; gap: var(--gap-sm); }
.workspace-page-hero-copy h2 { font-size: clamp(1.8rem, 2.5vw, 2.5rem); letter-spacing: -0.045em; }
.workspace-page-hero-copy p,
.workspace-page-hero-note,
.workspace-page-hero-side-card p { margin: 0; color: var(--text-soft); line-height: 1.62; }
.workspace-page-hero-head { display: flex; justify-content: space-between; gap: var(--gap-md); align-items: flex-start; }
.workspace-page-hero-side-card { display: grid; gap: var(--gap-sm); padding: var(--gap-md); background: var(--surface-2); border-radius: var(--r-lg); border: 1px solid var(--border); }
.workspace-hero-metric { display: grid; gap: var(--gap-sm); padding: var(--gap-md); background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--r-md); }
.workspace-hero-metric-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px,1fr)); gap: var(--gap-sm); }
.workspace-page-hero-chip { display: inline-flex; align-items: center; gap: var(--gap-xs); padding: 9px var(--gap-sm); border-radius: var(--r-full); background: rgba(0,0,0,.06); color: var(--text); font-size: .84rem; font-weight: 700; white-space: nowrap; }

/* ── 24. Department ────────────────────────────────────────────── */


.department-hero {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  padding: var(--gap-xl);
}

.department-kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: var(--gap-sm); margin-top: var(--gap-lg); }
.department-priority-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: var(--gap-sm); }
.department-roadmap-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: var(--gap-sm); }
.department-page { gap: var(--gap-lg); }

/* ── 25. Évaluations ───────────────────────────────────────────── */
.eval-workspace { padding-bottom: var(--gap-2xl); }
.eval-top-bar { display: flex; align-items: center; justify-content: space-between; gap: var(--gap-md); margin-bottom: var(--gap-xl); }
.eval-main-title { margin: 4px 0 0; font-size: clamp(1.8rem, 3vw, 2.6rem); letter-spacing: -0.035em; }

.eval-list-item {
  display: grid; gap: 4px;
  padding: var(--gap-sm) var(--gap-md);
  border-radius: var(--r-md);
  border: 1px solid var(--border);
  background: var(--surface);
  text-decoration: none;
  color: var(--text);
  transition: border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease);
}
.eval-list-item:hover { border-color: rgba(0,113,227,.2); box-shadow: var(--shadow-sm); }
.eval-list-item.is-active { border-color: rgba(0,113,227,.32); background: var(--accent-soft); box-shadow: 0 0 0 2px rgba(0,113,227,.1); }

.eval-list-month { font-weight: 700; font-size: .9rem; letter-spacing: -0.01em; }
.eval-list-meta { display: flex; align-items: center; justify-content: space-between; gap: var(--gap-xs); }
.eval-list-score { font-size: .82rem; font-weight: 700; padding: 3px 8px; border-radius: var(--r-full); }
.eval-list-status { font-size: .74rem; color: var(--text-soft); }
.eval-section { padding: var(--gap-lg); }

.eval-detail-header {
  display: flex; justify-content: space-between; align-items: flex-start; gap: var(--gap-lg);
  padding: var(--gap-lg);
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r-xl); box-shadow: var(--shadow-sm);
}
.eval-detail-title { margin: 4px 0 6px; font-size: 1.8rem; letter-spacing: -0.035em; }
.eval-detail-evaluator { margin: 0; color: var(--text-soft); display: flex; align-items: center; gap: var(--gap-sm); flex-wrap: wrap; }

.eval-status-badge { display: inline-block; padding: 4px 10px; border-radius: var(--r-full); font-size: .76rem; font-weight: 700; }
.eval-status-badge.is-complete { background: var(--green-soft); color: var(--green); }
.eval-status-badge.is-draft    { background: var(--gold-soft);  color: var(--gold); }

/* Score ring */
.eval-score-ring { position: relative; width: 88px; height: 88px; flex-shrink: 0; }
.eval-score-ring svg { display: block; }
.eval-score-ring-text { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; }
.eval-score-ring-text strong { font-size: 1.05rem; letter-spacing: -0.04em; line-height: 1; }
.eval-score-ring-text small { font-size: .62rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; opacity: .72; }
.eval-score-ring--empty .eval-score-ring-text strong { font-size: 1.4rem; color: var(--text-soft); }

/* Section grid */
.eval-section-grid { display: grid; grid-template-columns: 1fr 280px; gap: var(--gap-md); align-items: start; }

/* Gates (prérequis ÉLIMINATOIRES notables : OK / PAS OK / % accordé) */
/* Éditeur des prérequis (gates) : intitulé + type + réponse OK/PAS OK + % accordé */
.eval-gates-form { display: grid; gap: var(--gap-sm); }
.eval-gate-hint { font-size: .8rem; color: var(--text-soft); margin: 0 0 2px; line-height: 1.5; }
.eval-gates-list { display: grid; gap: var(--gap-xs); }
.eval-gate-head, .eval-gate-row { display: grid; grid-template-columns: minmax(0,1fr) 122px 118px 92px 30px; gap: 8px; align-items: center; }
.eval-gate-head { padding: 0 var(--gap-sm) 2px; font-size: .66rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--text-soft); }
.eval-gate-row { padding: var(--gap-xs) var(--gap-sm); border-radius: var(--r-sm); background: var(--surface-2); border: 1px solid var(--border); }
.eval-gate-input, .eval-gate-select, .eval-gate-pct { padding: 6px 8px; border-radius: var(--r-sm); border: 1px solid var(--border); background: var(--surface); font-size: .82rem; color: var(--text); width: 100%; }
.eval-gate-input:focus, .eval-gate-select:focus, .eval-gate-pct:focus { outline: 2px solid var(--accent); outline-offset: 1px; }
.eval-gate-label { font-weight: 600; }
/* Type : éliminatoire souligné en corail, barémique en or */
.eval-gate-row[data-gate-kind="eliminatory"] .eval-gate-kind { border-color: var(--coral, #FF3B30); color: var(--coral, #FF3B30); font-weight: 700; }
.eval-gate-row[data-gate-kind="scaled"] .eval-gate-kind { border-color: var(--gold, #FF9F0A); color: var(--gold, #FF9F0A); font-weight: 700; }
/* Réponse : OK vert, PAS OK corail */
.eval-gate-row[data-gate-status="ok"] .eval-gate-answer { border-color: var(--green); color: var(--green); font-weight: 700; }
.eval-gate-row[data-gate-status="nok"] .eval-gate-answer { border-color: var(--coral, #FF3B30); color: var(--coral, #FF3B30); font-weight: 700; }
.eval-gate-pct-wrap { display: inline-flex; align-items: center; gap: 3px; opacity: .35; transition: opacity .12s; }
.eval-gate-row.is-scaled-nok .eval-gate-pct-wrap { opacity: 1; }
.eval-gate-pct { width: 56px; text-align: right; }
.eval-gate-pct-sign { color: var(--text-soft); font-size: .8rem; }
.eval-gate-remove { border: none; background: transparent; color: var(--text-soft); font-size: 1.15rem; line-height: 1; cursor: pointer; border-radius: var(--r-sm); padding: 2px 6px; transition: color .12s, background .12s; }
.eval-gate-remove:hover { color: var(--coral, #FF3B30); background: var(--surface); }
@media (max-width: 640px) {
  .eval-gate-head { display: none; }
  .eval-gate-row { grid-template-columns: 1fr 1fr; }
  .eval-gate-label { grid-column: 1 / -1; }
  .eval-gate-remove { grid-column: 2; justify-self: end; }
}
/* Grille verrouillée quand un prérequis éliminatoire est raté */
.eval-lock-banner { padding: var(--gap-sm) var(--gap-md); border-radius: var(--r-sm); background: color-mix(in srgb, var(--coral, #FF3B30) 12%, var(--surface)); border: 1px solid var(--coral, #FF3B30); color: var(--coral, #FF3B30); font-weight: 600; font-size: .86rem; margin-bottom: var(--gap-sm); }
.eval-grid-form.is-locked { opacity: .5; pointer-events: none; filter: grayscale(.4); }
/* Prérequis en lecture seule sur une évaluation finalisée (figée) */
.eval-gates-form.is-frozen { display: grid; gap: var(--gap-sm); opacity: .72; }
.eval-gates-form.is-frozen input, .eval-gates-form.is-frozen select { pointer-events: none; background: var(--surface-2); }

/* Criteria table */
.eval-table-wrap { overflow-x: auto; border-radius: var(--r-md); border: 1px solid var(--border); }
.eval-criteria-table { width: 100%; border-collapse: collapse; font-size: .88rem; }
.eval-criteria-table th { padding: 10px var(--gap-md); background: var(--surface-2); text-align: left; font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-soft); border-bottom: 1px solid var(--border); }
.eval-criteria-table td { padding: 11px var(--gap-md); border-bottom: 1px solid rgba(0,0,0,.04); vertical-align: middle; }
.eval-criteria-table tr:last-child td { border-bottom: none; }
.eval-criteria-table tr:hover td { background: rgba(0,113,227,.02); }
.eval-pct-badge { display: inline-block; padding: 3px 8px; border-radius: var(--r-full); font-size: .8rem; font-weight: 700; }
.eval-pts { font-weight: 700; white-space: nowrap; }

/* ── Évaluations : refonte (colonne unique, grille notable, mois suivant, historique en bas) ── */
.eval-main-single { display: grid; gap: var(--gap-md); }
.eval-open-form { display: flex; align-items: flex-end; gap: var(--gap-xs); }
.eval-open-label { display: grid; gap: 4px; font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--text-soft); }
.eval-month-input { padding: 8px 12px; border: 1.5px solid var(--border-strong); border-radius: var(--r-md); font: inherit; font-size: .9rem; background: var(--surface); }
.eval-month-input:focus { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }

/* Grille de NOTATION éditable */
.eval-criteria-scoring .eval-cell-input,
.eval-criteria-scoring .eval-points-input {
  width: 100%; box-sizing: border-box; padding: 7px 9px;
  border: 1.5px solid var(--border-strong); border-radius: 9px;
  font: inherit; font-size: .86rem; background: var(--surface);
}
.eval-criteria-scoring .eval-points-input { width: 74px; text-align: right; }
.eval-criteria-scoring .eval-cell-input:focus,
.eval-criteria-scoring .eval-points-input:focus { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }
.eval-criteria-scoring .eval-crit-label { font-weight: 650; }
.eval-criteria-scoring .eval-crit-target { color: var(--text-soft); }
.eval-pts-cell { white-space: nowrap; }
.eval-pts-sep { color: var(--text-muted); font-size: .82rem; margin-left: 4px; }
.eval-grid-total td { border-top: 2px solid var(--border); background: var(--surface-2); font-weight: 700; }
.eval-grid-total .eval-pct-badge { font-size: .95rem; }

/* Section « critères du mois prochain » */
.eval-next-section { border: 1px solid rgba(0,113,227,.28); box-shadow: none; }
.eval-nc-head, .eval-nc-row {
  display: grid; grid-template-columns: 1fr 130px 90px 34px; gap: 8px; align-items: center;
}
.eval-nc-head { padding: 0 2px 4px; font-size: .68rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--text-muted); }
.eval-nc-list { display: grid; gap: 8px; }
.eval-nc-input { padding: 8px 10px; border: 1.5px solid var(--border-strong); border-radius: 9px; font: inherit; font-size: .86rem; background: var(--surface); box-sizing: border-box; width: 100%; }
.eval-nc-input:focus { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }
.eval-nc-remove {
  width: 32px; height: 32px; border: 0; border-radius: var(--r-full); cursor: pointer;
  background: var(--surface-2); color: var(--text-soft); font-size: 1.2rem; line-height: 1;
  display: grid; place-items: center; transition: background .14s, color .14s;
}
.eval-nc-remove:hover { background: rgba(229,84,75,.14); color: #e5544b; }
.eval-nc-actions { display: flex; align-items: center; justify-content: space-between; gap: var(--gap-sm); margin-top: var(--gap-sm); flex-wrap: wrap; }

/* Historique en bas (bande horizontale) */
.eval-history-panel { margin-top: var(--gap-sm); }
.eval-history-strip { display: flex; gap: var(--gap-sm); overflow-x: auto; padding: 2px; scrollbar-width: thin; }
.eval-history-card {
  flex: 0 0 auto; min-width: 128px; display: grid; gap: 4px; justify-items: start;
  padding: 11px 14px; border: 1px solid var(--border); border-radius: var(--r-md);
  background: var(--surface); text-decoration: none; color: var(--text);
  transition: border-color .14s, box-shadow .14s, transform .14s;
}
.eval-history-card:hover { border-color: var(--accent); box-shadow: var(--shadow-sm); transform: translateY(-1px); }
.eval-history-card.is-active { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.eval-history-month { font-weight: 650; font-size: .9rem; letter-spacing: -.01em; }
.eval-history-score { font-size: 1.15rem; font-weight: 750; letter-spacing: -.02em; }
.eval-history-status { font-size: .72rem; color: var(--text-soft); }
@media (max-width: 640px) {
  .eval-nc-head, .eval-nc-row { grid-template-columns: 1fr 84px 30px; }
  .eval-nc-head span:nth-child(2), .eval-nc-row .eval-nc-target { display: none; }
}

/* Commission */
.eval-commission-card { padding: var(--gap-lg); background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); display: grid; gap: var(--gap-sm); }
.eval-commission-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: var(--gap-xs); }
.eval-commission-item { display: grid; gap: 3px; padding: var(--gap-xs) var(--gap-sm); background: var(--surface-2); border-radius: var(--r-sm); }
.eval-commission-item span { font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--text-soft); }
.eval-commission-item strong { font-size: 1.05rem; letter-spacing: -0.02em; }
.eval-commission-total { display: flex; align-items: center; justify-content: space-between; padding: var(--gap-sm) var(--gap-md); border-radius: var(--r-sm); }
.eval-commission-total span { font-weight: 600; font-size: .88rem; }
.eval-commission-total strong { font-size: 1.4rem; letter-spacing: -0.04em; }
/* Ligne « Prérequis » de la carte commission : effet des gates sur la prime */
.eval-commission-gate.is-ok { color: var(--green); }
.eval-commission-gate.is-scaled { color: var(--gold, #FF9F0A); }
.eval-commission-gate.is-blocked { color: var(--coral, #FF3B30); font-size: .82rem; }
/* Finalisation : enveloppe / accélérateurs / malus éditables + estimation live */
.eval-commission-inputs { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--gap-sm); }
.eval-form-field { display: grid; gap: 4px; }
.eval-commission-estimate { margin: 2px 0 0; font-size: .82rem; color: var(--text-soft); font-weight: 600; }
@media (max-width: 640px) { .eval-commission-inputs { grid-template-columns: 1fr; } }

/* Actions */
.eval-actions-list { display: grid; gap: var(--gap-xs); }
.eval-action-item { padding: var(--gap-sm) var(--gap-md); border-radius: var(--r-sm); background: var(--surface-2); border: 1px solid var(--border); transition: opacity var(--duration) var(--ease); }
.eval-action-item.is-done { opacity: .52; }
.eval-action-head { display: flex; align-items: flex-start; gap: var(--gap-xs); margin-bottom: 4px; }
.eval-action-label { font-size: .9rem; line-height: 1.4; font-weight: 600; }
.eval-action-why { margin: 4px 0 0; font-size: .8rem; color: var(--text-soft); line-height: 1.4; }
.eval-action-indicator { margin: 4px 0 0; font-size: .8rem; color: var(--accent); line-height: 1.4; }

.eval-action-toggle {
  flex-shrink: 0; width: 26px; height: 26px;
  border-radius: var(--r-full);
  border: 2px solid var(--border-strong);
  background: transparent;
  cursor: pointer; font-size: .85rem;
  display: inline-grid; place-items: center;
  color: var(--text-soft);
  transition: border-color var(--duration), background var(--duration), color var(--duration);
}
.eval-action-toggle.is-done { background: var(--green); border-color: var(--green); color: #FFF; }
.eval-action-toggle:hover:not(.is-done) { border-color: var(--accent); color: var(--accent); }

/* Comments */
.eval-comment-block { padding: var(--gap-sm) var(--gap-md); border-radius: var(--r-sm); background: var(--surface-2); border: 1px solid var(--border); margin-bottom: var(--gap-xs); }
.eval-comment-block:last-child { margin-bottom: 0; }
.eval-comment-text { margin: 6px 0 0; line-height: 1.6; white-space: pre-wrap; font-size: .88rem; }

/* Save form */
.eval-save-form { display: grid; gap: var(--gap-md); }
.eval-form-row { display: grid; gap: 6px; }
.eval-form-label { font-size: .8rem; font-weight: 700; color: var(--text-soft); letter-spacing: .02em; }
.eval-form-input { padding: 11px var(--gap-sm); border-radius: var(--r-sm); border: 1px solid var(--border-strong); background: var(--surface); font: inherit; max-width: 200px; width: 100%; }
.eval-form-input:focus { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }
.eval-form-textarea { padding: 11px var(--gap-sm); border-radius: var(--r-sm); border: 1px solid var(--border-strong); background: var(--surface); font: inherit; width: 100%; resize: vertical; min-height: 80px; }
.eval-form-textarea:focus { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }
.eval-form-select { padding: 10px var(--gap-sm); border-radius: var(--r-sm); border: 1px solid var(--border-strong); background: var(--surface); font: inherit; min-width: 160px; }
.eval-form-actions { padding-top: 4px; }
.eval-pending-panel { padding: var(--gap-lg); }
.eval-pending-list { display: grid; gap: var(--gap-xs); }
.eval-pending-item { padding: var(--gap-xs) var(--gap-sm); border-radius: var(--r-sm); background: var(--surface-2); border: 1px solid var(--border); display: grid; gap: 3px; }
.eval-pending-item p { margin: 0; font-size: .86rem; line-height: 1.4; }
.eval-pending-month { font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--accent); }
.eval-sales-score-block.tone-green  { background: var(--green); }
.eval-sales-score-block.tone-teal   { background: var(--accent); }
.eval-sales-score-block.tone-gold   { background: var(--gold); color: var(--text); }
.eval-sales-score-block.tone-coral  { background: var(--coral); }
.eval-sales-score-block.tone-blue   { background: var(--accent); }
.eval-bar.tone-green  { background: var(--green); }
.eval-bar.tone-teal   { background: var(--accent); }
.eval-bar.tone-gold   { background: var(--gold); }
.eval-bar.tone-coral  { background: var(--coral); }
.eval-bar.tone-blue   { background: var(--accent); }

/* ── 27. History ───────────────────────────────────────────────── */
.history-table-wrap { overflow-x: auto; border-radius: var(--r-lg); border: 1px solid var(--border); }
.history-table { width: 100%; border-collapse: collapse; font-size: .86rem; }
.history-table th { padding: 10px var(--gap-md); background: var(--surface-2); text-align: left; font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-soft); border-bottom: 1px solid var(--border); }
.history-table td { padding: 11px var(--gap-md); border-bottom: 1px solid rgba(0,0,0,.04); vertical-align: top; }
.history-table tr:last-child td { border-bottom: none; }
.history-table tr:hover td { background: rgba(0,0,0,.02); }
.script-feedback-form { display: grid; gap: var(--gap-sm); }

/* Drawers & modals */
.modal-overlay {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.42);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 9000;
  display: grid; place-items: center;
  animation: fade 150ms var(--ease);
}

.dialog-shell, .detail-dialog {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-lg);
  padding: var(--gap-xl);
  width: min(600px, 90vw);
  max-height: 90vh;
  overflow-y: auto;
  animation: rise 180ms var(--ease);
}

/* Workbench */
.sales-compact-support-panel { grid-column: 1 / -1; width: 100%; display: grid; gap: var(--gap-lg); }
.sales-compact-support-panel .sales-mini-mission-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--gap-sm); }

/* ── 30. Responsive ────────────────────────────────────────────── */
@media (max-width: 1360px) {
  .smm-pulse-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
  .smm-decision-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .smm-risk-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .crm-pipeline-board { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 1120px) {
  

  

  
  .sales-side-link, .sales-side-toggle { white-space: nowrap; }

  .workspace-page-hero,
  .sales-command-panel,
  .crm-activity-command-panel,
  .hero-grid,
  .workspace-hero-grid,
  .mission-hero-grid,
  .pointage-hero-grid,
  .smm-hero-grid,
  .crm-page-layout,
  .crm-home-bottom-grid,
  .crm-home-main-grid,
  .crm-home-support-grid,
  .crm-activities-command-layout,
  .mission-workspace,
  .workspace-balanced-grid,
  .split,
  .smm-priority-grid,
  .smm-safety-doc-grid,
  .crm-company-detail-grid,
  .crm-company-bottom-grid,
  .crm-context-cols,
  .crm-focus-session-list,
  .crm-script-intelligence-grid,
  .crm-report-split-grid { grid-template-columns: 1fr; }

  .workspace-page-hero-side { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .eval-section-grid { grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
  :root {
    --gap-lg: 18px;
    --gap-xl: 24px;
  }

  .app-shell,
  .sales-immersive-shell { padding: var(--gap-sm); }

  .sales-progress-strip,
  .smm-pulse-grid,
  .metric-snapshot-grid,
  .pointage-stat-grid,
  .crm-pipeline-board,
  .crm-entity-card-grid,
  .mission-pulse-grid,
  .sales-closeout-topline,
  .department-kpi-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }

  .planning-stat-grid,
  .mission-handoff-grid,
  .monthly-metrics-form-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }

  .crm-report-verdict-grid,
  .crm-report-objective-grid,
  .crm-report-stage-grid,
  .department-priority-grid,
  .department-roadmap-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }

  .smm-risk-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
}

@media (max-width: 600px) {
  .form-grid          { grid-template-columns: 1fr; }
  .sales-mini-day-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }

  .smm-decision-grid,
  .smm-risk-grid,
  .department-kpi-grid,
  .sales-progress-strip,
  .pointage-stat-grid,
  .crm-pipeline-board,
  .sales-closeout-topline { grid-template-columns: 1fr; }

  .crm-report-verdict-grid,
  .crm-report-objective-grid { grid-template-columns: 1fr; }

  .rh-contract-choice-grid { grid-template-columns: 1fr; }
  .rh-contract-wizard, .rh-contract-upload-form { padding: var(--gap-md); }
  .rh-technician-grid { grid-template-columns: 1fr; }

  .crm-report-action-row,
  .crm-report-verdict-card > div,
  .crm-report-objective-head { align-items: flex-start; flex-direction: column; }
}

/* ── Fin du fichier ────────────────────────────────────────────── */

/* PLANNING V2 (.ptv2-*, .status-*) retiré le 2026-07-28 : aucune de ces règles
   n'était atteignable. Le seul producteur des classes .status-* était
   _planning_status_class(), qui n'était appelée nulle part, et le balisage
   .ptv2-* n'existait plus dans views.py. La grille en service est .pg-*. */

/* ── Missions actives dans la vue RH ── */
.rh-active-missions-panel { margin-top: var(--gap-lg); }

.rh-mission-list { display: grid; gap: var(--gap-sm); }

.rh-mission-row {
  display: flex;
  align-items: flex-start;
  gap: var(--gap-md);
  padding: var(--gap-sm) var(--gap-md);
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  transition: border-color var(--duration);
}

.rh-mission-row:hover { border-color: rgba(0,113,227,.2); }

.rh-mission-col {
  display: grid;
  gap: 3px;
  min-width: 0;
  flex: 1;
}

.rh-mission-client { flex: 2; }
.rh-mission-col strong { font-size: .88rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rh-mission-col p { margin: 0; font-size: .82rem; color: var(--text-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ================================================================
   PLANNING GANTT — version épurée définitive (pg-)
   ================================================================ */
.pg-body {
  margin: 0;
  background: var(--bg);
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  font-family: var(--font);
  color: var(--text);
}

/* Topnav sombre fine */







/* Mode consultation (rôles non-planning) : lecture pure, actions masquées */
.pg-readonly-pill {
  background: rgba(255,255,255,.16);
  color: #fff;
  border-radius: var(--r-full);
  padding: 3px 10px;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: help;
}
.pg-readonly .pg-bar-validate { display: none; }
.pg-readonly .pg-bar--manual,
.pg-readonly .pg-bar--odoo,
.pg-readonly .pg-cell[data-pg-cell] { cursor: default; }
.pg-readonly .pg-bar-resize { display: none; }

/* Page fiche autonome (rôle planning) : la fiche allégée, rien d'autre */
.pg-fiche-wrap { width: min(760px, 100%); margin: 0 auto; padding: 24px 16px 56px; }
.pg-fiche-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-lg);
  padding: 22px;
}

.pg-btn-ghost {
  background: rgba(255,255,255,.12); color: rgba(255,255,255,.85);
  border: 0; border-radius: 8px; padding: 6px 12px;
  font-size: .82rem; font-weight: 600; cursor: pointer; text-decoration: none;
  transition: background .12s;
}
.pg-btn-ghost:hover { background: rgba(255,255,255,.2); color: #fff; }

.pg-flash {
  margin: 10px 18px 0; padding: 10px 14px;
  background: var(--accent-soft); border: 1px solid rgba(0,113,227,.25); border-radius: 10px;
  color: var(--accent-dark); font-size: .86rem; font-weight: 600;
}

/* Toolbar claire */
.pg-toolbar {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  padding: 10px 18px;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.pg-nav { display: flex; align-items: center; gap: 6px; }
.pg-nav-btn {
  width: 32px; height: 32px; display: grid; place-items: center;
  border-radius: 8px; background: var(--surface-2); color: var(--text-soft);
  font-size: 1rem; text-decoration: none; transition: background .12s;
}
.pg-nav-btn:hover { background: var(--surface-3); }
.pg-add-btn {
  border: 0;
  background: var(--accent);
  color: #fff;
  border-radius: 8px;
  padding: 8px 14px;
  font-size: .82rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  transition: filter var(--duration) var(--ease);
}
.pg-add-btn:hover { filter: brightness(1.08); }
.pg-month { font-size: 1.05rem; font-weight: 700; letter-spacing: -.02em; min-width: 150px; text-align: center; text-transform: capitalize; }

.pg-search-box { flex: 1; max-width: 320px; }
.pg-search-box input {
  width: 100%; padding: 8px 13px; border: 1px solid var(--border-strong);
  border-radius: 9px; font-size: .86rem; background: var(--surface); color: var(--text);
}
.pg-search-box input:focus { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }

.pg-legend { display: flex; gap: 8px 14px; flex-wrap: wrap; margin-left: auto; }
.pg-legend span { display: flex; align-items: center; gap: 5px; font-size: .76rem; font-weight: 600; color: var(--text-soft); }
.pg-legend i { width: 13px; height: 10px; border-radius: 3px; display: inline-block; flex-shrink: 0; }
/* ── Tuiles « pouls du jour » au-dessus du planning ─────────────────────── */
.pg-tiles-wrap { padding: 10px 18px 0; }
.pg-tiles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}
.pg-tile {
  display: grid;
  gap: 2px;
  text-align: left;
  background: var(--surface, #fff);
  border: 1px solid rgba(15, 33, 55, .1);
  border-radius: 12px;
  padding: 12px 14px;
  font-family: inherit;
  color: inherit;
}
.pg-tile strong { font-size: 1.45rem; line-height: 1.1; }
.pg-tile span { font-size: .82rem; font-weight: 700; }
.pg-tile small { font-size: .72rem; color: var(--text-soft, #64748b); }
.pg-tile.is-zero strong { color: var(--text-soft, #94a3b8); }
button.pg-tile { cursor: pointer; transition: border-color .12s ease, box-shadow .12s ease, transform .12s ease; }
button.pg-tile:hover { border-color: var(--accent, #2563EB); transform: translateY(-1px); box-shadow: 0 6px 16px rgba(10, 42, 57, .1); }
.pg-tile--avail strong { color: #16A34A; }
.pg-tile--avail.is-open { border-color: #16A34A; box-shadow: 0 0 0 2px rgba(22, 163, 74, .18); }
.pg-tile--conflict:not(.is-zero) strong { color: #DC2626; }
/* Statuts extraordinaires : maladie (indigo) / congé (ambre) — couleurs Odoo */
.pg-tile--sick:not(.is-zero) strong { color: #5C6BC0; }
.pg-tile--leave:not(.is-zero) strong { color: #C99700; }
.pg-tile--sick.is-open { border-color: #5C6BC0; box-shadow: 0 0 0 2px rgba(92, 107, 192, .18); }
.pg-tile--leave.is-open { border-color: #C99700; box-shadow: 0 0 0 2px rgba(201, 151, 0, .18); }
/* Tuile survolée pendant un glisser de chip (cible de dépôt d'un statut du jour) */
.pg-tile--droptarget { border-color: var(--accent, #2563EB); border-style: dashed; box-shadow: 0 0 0 3px rgba(37, 99, 235, .22); transform: translateY(-1px); }
/* Panneau des disponibles : chips glissables vers la grille */
.pg-avail-panel {
  margin-top: 10px;
  background: var(--surface, #fff);
  border: 1px solid rgba(22, 163, 74, .35);
  border-radius: 12px;
  padding: 12px 14px;
}
.pg-avail-hint { margin: 0 0 8px; font-size: .78rem; color: var(--text-soft, #64748b); }
.pg-avail-chips { display: flex; flex-wrap: wrap; gap: 8px; max-height: 132px; overflow-y: auto; }
.pg-avail-chip {
  display: inline-flex;
  align-items: center;
  padding: 5px 12px;
  border-radius: 999px;
  background: rgba(22, 163, 74, .1);
  border: 1px solid rgba(22, 163, 74, .35);
  color: #166534;
  font-size: .8rem;
  font-weight: 700;
  user-select: none;
}
.pg-avail-chip[draggable="true"] { cursor: grab; }
.pg-avail-chip[draggable="true"]:hover { background: rgba(22, 163, 74, .18); }
.pg-avail-chip.is-dragging { opacity: .45; }
.pg-avail-empty { font-size: .8rem; color: var(--text-soft, #64748b); }
/* Retrait manuel des disponibles (absence apprise hors MASTERSALES) */
.pg-avail-x {
  border: none;
  background: transparent;
  margin-left: 4px;
  padding: 0 2px;
  font-size: .7rem;
  line-height: 1;
  color: var(--text-muted, #AEAEB2);
  cursor: pointer;
  border-radius: 4px;
}
.pg-avail-x:hover { color: var(--coral, #FF3B30); background: var(--coral-soft, rgba(255,59,48,.10)); }
.pg-avail-exclude {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  padding: 8px 10px;
  font-size: .82rem;
  background: var(--surface-2, #F2F2F7);
  border: 1px solid var(--surface-3, #E5E5EA);
  border-radius: 8px;
}
.pg-avail-exclude input[type="date"] {
  padding: 4px 8px;
  border: 1px solid var(--surface-3, #E5E5EA);
  border-radius: 6px;
  font: inherit;
}
.pg-avail-exclude .pg-btn-primary,
.pg-avail-exclude .pg-btn-ghost { padding: 5px 12px; font-size: .8rem; }
.pg-avail-excluded {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  font-size: .8rem;
  color: var(--text-soft, #6E6E73);
}
.pg-avail-excluded-caption { font-weight: 600; }
.pg-avail-excluded-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 8px;
  border: 1px dashed var(--surface-3, #E5E5EA);
  border-radius: 999px;
  background: var(--surface, #FFFFFF);
  color: var(--text-soft, #6E6E73);
}
.pg-avail-excluded-item i { font-style: normal; color: var(--text-muted, #AEAEB2); }
.pg-avail-restore {
  border: none;
  background: transparent;
  padding: 0;
  font-size: .78rem;
  font-weight: 600;
  color: var(--accent, #0071E3);
  cursor: pointer;
}
.pg-avail-restore:hover { text-decoration: underline; }

/* ── Urgence des priorités SMM→SALES : Très urgent (rouge clignotant, en
   tête) > Urgent (rouge) > Normal (orange). Tri fait côté SQL. ─────────── */
.urgency-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 9px;
  border-radius: 999px;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  vertical-align: middle;
}
.urgency-badge.is-critical { background: var(--coral, #FF3B30); color: #fff; animation: urgency-blink 1.1s ease-in-out infinite; }
.urgency-badge.is-urgent { background: var(--coral-soft, rgba(255,59,48,.10)); color: var(--coral, #FF3B30); border: 1px solid var(--coral, #FF3B30); }
.urgency-badge.is-normal { background: var(--gold-soft, rgba(255,159,10,.10)); color: #B36B00; border: 1px solid var(--gold, #FF9F0A); }
@keyframes urgency-blink {
  0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(255, 59, 48, .45); }
  50% { opacity: .55; box-shadow: 0 0 0 5px rgba(255, 59, 48, 0); }
}
.sales-priority-card.is-urg-critical,
.priority-task-card.is-urg-critical { border-left: 4px solid var(--coral, #FF3B30); }
.sales-priority-card.is-urg-urgent,
.priority-task-card.is-urg-urgent { border-left: 4px solid rgba(255, 59, 48, .55); }
.sales-priority-card.is-urg-normal,
.priority-task-card.is-urg-normal { border-left: 4px solid var(--gold, #FF9F0A); }
.urgency-form select {
  font-size: .74rem;
  padding: 3px 6px;
  border: 1px solid var(--surface-3, #E5E5EA);
  border-radius: 6px;
  background: var(--surface, #FFFFFF);
}
/* Ligne « 👤 À désigner » (créneaux réservés sans noms) */
.pg-row-unstaffed { font-style: italic; color: var(--text-soft, #6E6E73); }
.pg-field--headcount input { max-width: 110px; }

/* Archivage technicien (parti) : bandeau fiche + badge liste des anciens */
/* Barre d'actions en tête de fiche technicien : Archiver + Accès terrain. */
.rh-detail-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 10px 0 4px;
}
.rh-detail-actions .rh-inline-form { margin: 0; }
.rh-action-btn,
.rh-action-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.rh-action-btn svg { flex-shrink: 0; opacity: .8; }
.rh-action-tag svg { flex-shrink: 0; }
.rh-action-tag.is-ok svg { color: var(--green, #34C759); }
.rh-archived-tag {
  display: inline-flex;
  padding: 1px 7px;
  border-radius: 999px;
  font-size: .68rem;
  font-weight: 700;
  background: var(--gold-soft, rgba(255,159,10,.10));
  border: 1px solid var(--gold, #FF9F0A);
  color: #B36B00;
}

/* Changement d'urgence appliqué SANS rechargement : bref surlignage pour
   montrer que la carte a bien bougé/changé. */
.priority-task-card.urgency-updated {
  outline: 2px solid var(--accent, #0071E3);
  outline-offset: 2px;
  transition: outline-color .3s;
}
/* Accessibilité : pas d'animation pour qui la refuse (le rouge plein suffit). */
@media (prefers-reduced-motion: reduce) {
  .urgency-badge.is-critical { animation: none; }
}
.pg-undo-btn { white-space: nowrap; width: auto !important; min-width: 0; padding: 0 12px; }
/* 📨 : le technicien a été prévenu de l'état actuel du créneau (Lot C). */
.pg-bar-notif { margin-left: auto; flex-shrink: 0; font-size: .72rem; opacity: .95; }

/* Sélecteur de statut MÉTIER (Lot D) — popover Encodage + SMM posé sur la
   barre cliquée : pas reçu → reçu → encodé → facturé (couleurs Odoo). */
.pg-status-pop {
  position: fixed;
  z-index: 260;
  width: 240px;
  background: var(--surface, #FFFFFF);
  border: 1px solid var(--surface-3, #E5E5EA);
  border-radius: 10px;
  box-shadow: 0 12px 32px rgba(10, 42, 57, .25);
  padding: 10px;
}
.pg-status-pop-title {
  margin: 0 0 8px;
  font-size: .74rem;
  font-weight: 700;
  color: var(--text, #1D1D1F);
  line-height: 1.3;
  word-break: break-word;
}
.pg-status-pop form { display: flex; flex-direction: column; gap: 4px; }
.pg-status-pop form button {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  border: 1px solid transparent;
  background: transparent;
  border-radius: 7px;
  padding: 7px 8px;
  font-size: .82rem;
  font-weight: 600;
  color: var(--text, #1D1D1F);
  cursor: pointer;
  text-align: left;
}
.pg-status-pop form button:hover { background: var(--surface-2, #F2F2F7); border-color: var(--surface-3, #E5E5EA); }
.pg-status-pop form button:focus-visible { outline: 2px solid var(--accent, #0071E3); outline-offset: 1px; }
.pg-status-pop form button i {
  width: 12px;
  height: 12px;
  border-radius: 3px;
  flex-shrink: 0;
}
/* Statut du bon DANS la fenêtre d'édition (comptes qui éditent ET statuent).
   Même vocabulaire visuel que le petit menu de l'Encodage : une pastille de
   couleur + un libellé, en ligne cette fois puisqu'on a la largeur. */
.pg-bon-status { display: grid; gap: 6px; }
.pg-bon-status-label { font-size: .78rem; font-weight: 600; color: var(--text, #1D1D1F); }
.pg-bon-status-row { display: flex; flex-wrap: wrap; gap: 6px; }
.pg-bon-status-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--surface-3, #E5E5EA);
  background: var(--surface, #FFFFFF);
  border-radius: 999px;
  padding: 6px 12px;
  font-size: .8rem;
  font-weight: 600;
  color: var(--text, #1D1D1F);
  cursor: pointer;
}
.pg-bon-status-btn i { width: 10px; height: 10px; border-radius: 3px; flex-shrink: 0; }
.pg-bon-status-btn:hover { background: var(--surface-2, #F2F2F7); }
.pg-bon-status-btn:focus-visible { outline: 2px solid var(--accent, #0071E3); outline-offset: 1px; }
.pg-bon-status-btn.is-active {
  border-color: var(--accent, #0071E3);
  box-shadow: inset 0 0 0 1px var(--accent, #0071E3);
}

.pg-status-pop-reset {
  margin-top: 4px;
  border-top: 1px solid var(--surface-3, #E5E5EA) !important;
  border-radius: 0 0 7px 7px !important;
  color: var(--text-soft, #6E6E73) !important;
  font-weight: 500 !important;
  font-size: .76rem !important;
}
/* Encodage + SMM : les barres MASTERSALES deviennent cliquables (statut). */
.pg-statuser .pg-bar--manual { cursor: pointer; }

/* Pastilles « À traiter » cliquables : filtrent la grille sur les créneaux qui
   demandent cette action (re-cliquer rétablit la vue complète). */
.pg-filter-chip {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: .76rem;
  font-weight: 600;
  color: var(--text-soft);
  background: none;
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 2px 9px;
  cursor: pointer;
  font-family: inherit;
  transition: background .12s ease, border-color .12s ease, color .12s ease;
}
.pg-filter-chip:hover { background: var(--accent-soft, #e8f0fe); color: var(--ink, #16233a); }
.pg-filter-chip.is-active {
  background: var(--ink, #16233a);
  border-color: var(--ink, #16233a);
  color: #fff;
}
.pg-filter-chip.is-active i { outline: 1px solid rgba(255, 255, 255, .6); }
/* Bloc unique pour les 2 lignes de légende : bords gauches alignés,
   plus d'effet « escalier » entre les deux rangées de couleurs. */
.pg-legends { margin-left: auto; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.pg-legends .pg-legend { margin-left: 0; }
/* 2e ligne de légende : statuts métier lus dans Odoo (lecture seule) */
.pg-legend--odoo { padding-top: 6px; border-top: 1px dashed var(--border); align-self: stretch; }
.pg-legend-caption { font-size: .68rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--text-muted); }

/* Conteneur scrollable */
.pg-scroll {
  flex: 1;
  overflow-x: hidden;
  overflow-y: auto;
  background: var(--surface);
}

/* Variables grille — colonnes en 1fr pour remplir 100% de la largeur */
.pg-grid {
  --pg-label: 196px;
  --pg-row: 34px;
  --pg-hrow: 48px;
  --pg-col: minmax(0, 1fr);  /* colonnes jour : 1fr sur desktop, largeur fixe sur mobile */
  width: 100%;
}

/* En-tête collant */
.pg-head {
  display: flex;
  position: sticky; top: 0; z-index: 30;
  background: var(--surface-2);
  border-bottom: 1px solid var(--border-strong);
}
.pg-hlabel {
  width: var(--pg-label); flex-shrink: 0;
  position: sticky; left: 0; z-index: 31;
  background: var(--surface-2);
  display: flex; align-items: center;
  padding: 0 14px;
  font-size: .64rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--text-muted);
  border-right: 1px solid var(--border-strong);
  min-height: var(--pg-hrow);
}
.pg-hdays { flex: 1; display: grid; grid-template-columns: repeat(var(--pg-days,30), var(--pg-col, minmax(0, 1fr))); }
.pg-hday {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0;
  min-height: var(--pg-hrow);
  border-right: 1px solid var(--border);
}
.pg-hday b { font-size: .76rem; font-weight: 700; line-height: 1.1; color: var(--text); }
.pg-hday span { font-size: .54rem; letter-spacing: .03em; text-transform: uppercase; color: var(--text-muted); line-height: 1.1; }
.pg-hday i { font-size: .54rem; font-weight: 700; color: var(--accent); font-style: normal; line-height: 1.1; }
.pg-hday.is-weekend { background: var(--surface-2); }
.pg-hday.is-weekend b { color: var(--text-muted); }
/* Jour courant : nettement bleuté + barre d'accent en haut, pour le distinguer
   au premier coup d'œil des week-ends (gris). is-today gagne sur is-weekend
   (règle plus bas dans la cascade) même quand aujourd'hui tombe un week-end. */
.pg-hday.is-today { background: rgba(0,113,227,.18); box-shadow: inset 0 3px 0 var(--accent); }
.pg-hday.is-today b { color: var(--accent); }
.pg-hday.is-today span { color: var(--accent); }

/* Groupe client */
.pg-client { border-top: 1px solid var(--border); }
.pg-client:first-of-type { border-top: none; }
.pg-client-head {
  display: flex; align-items: center; gap: 10px;
  position: sticky; left: 0; z-index: 12;
  width: 100%;
  background: var(--surface-2);
  border-bottom: 1px solid var(--border);
  padding: 4px 14px;
  min-height: 30px;
}
.pg-client-name { font-size: .84rem; font-weight: 700; color: var(--text); white-space: nowrap; }
.pg-client-meta { font-size: .7rem; color: var(--text-muted); white-space: nowrap; }
/* En-tête client cliquable : replier/déplier ce client */
.pg-client-head[data-pg-client-toggle] { cursor: pointer; user-select: none; }
.pg-client-head[data-pg-client-toggle]:hover { background: var(--surface-3); }
.pg-client-chevron { font-size: .7rem; color: var(--text-muted); transition: transform .15s ease; line-height: 1; }
.pg-client.is-collapsed .pg-client-chevron { transform: rotate(-90deg); }
/* Client replié : on masque les lignes techniciens, on garde l'en-tête */
.pg-client.is-collapsed .pg-row { display: none; }
/* Boutons replier/déplier tout (haut à droite de la barre d'outils) */
/* Rangée du haut de la barre d'outils : navigation mois à gauche, boutons
   replier/déplier tout à droite (toujours en haut à droite du planning). */
.pg-toolbar-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex: 1 1 100%; }
.pg-collapse-controls { display: flex; align-items: center; gap: 6px; }
.pg-collapse-controls .pg-nav-btn { border: none; cursor: pointer; font-size: 1.05rem; }

/* Ligne technicien */
.pg-row { display: flex; border-bottom: 1px solid var(--border); min-height: var(--pg-row); }
/* [hidden] doit l'emporter sur display:flex ci-dessus (recherche technicien) */
.pg-row[hidden] { display: none; }
.pg-row:hover { background: var(--surface-2); }
.pg-row-label {
  width: var(--pg-label); flex-shrink: 0;
  position: sticky; left: 0; z-index: 10;
  background: var(--surface);
  display: flex; flex-direction: column; justify-content: center; gap: 0;
  padding: 3px 14px;
  border-right: 1px solid var(--border);
  overflow: hidden;
}
.pg-row:hover .pg-row-label { background: var(--surface-2); }

/* Nom de technicien cliquable → fiche (demande Yuri 2026-07-12) */
.pg-row-link { color: inherit; text-decoration: none; }
.pg-row-link:hover span { color: var(--accent); text-decoration: underline; }
.pg-row-label span { font-size: .8rem; font-weight: 500; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pg-row-label small { font-size: .64rem; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Voie calendrier — --pg-depth = nombre de sous-lignes empilées (barres qui se
   chevauchent), défini en ligne par le serveur ; défaut 1 (aucun chevauchement). */
.pg-lane {
  flex: 1;
  display: grid;
  grid-template-columns: repeat(var(--pg-days,30), var(--pg-col, minmax(0, 1fr)));
  grid-template-rows: repeat(var(--pg-depth, 1), var(--pg-row));
  grid-auto-rows: var(--pg-row);
  position: relative;
}
.pg-cell {
  grid-row: 1 / -1;
  border-right: 1px solid var(--border);
  cursor: pointer;
}
.pg-cell.is-weekend { background: var(--surface-2); }

/* Témoin permanent « ✓ Enregistré à 14:12 » dans la barre d'outils du planning
   (2026-07-29). La pastille s'effaçait en 4 secondes : c'était le seul accusé
   de réception, et son effacement poussait à refaire le geste — donc à créer
   des doublons. Celui-ci reste jusqu'au geste suivant. */
.pg-state {
  display: inline-flex;
  align-items: center;
  padding: 0 var(--gap-sm);
  font-size: 0.82rem;
  font-variant-numeric: tabular-nums;
  color: var(--green);
  white-space: nowrap;
}
.pg-state:empty { display: none; }
.pg-state.is-error { color: var(--coral); font-weight: 600; }
/* Jour férié belge : même teinte que le week-end, plus un liséré qui le
   distingue d'un simple samedi (2026-07-29). Son nom s'affiche au survol. */
.pg-cell.is-holiday {
  background: var(--surface-2);
  box-shadow: inset 0 2px 0 0 var(--border);
}
/* La colonne d'aujourd'hui : bleu franc sur toute la hauteur (bien au-dessus du
   gris week-end). is-today déclaré après is-weekend → gagne si les deux. */
.pg-cell.is-today { background: rgba(0,113,227,.12); }
.pg-cell[data-pg-cell]:hover { background: rgba(0,113,227,.20); }

/* Barres d'affectation */
.pg-bar {
  grid-row: 1;
  margin: 3px 1px;
  border-radius: 6px;
  padding: 0 8px;
  display: flex; align-items: center; gap: 6px;
  color: #fff;
  font-size: .72rem; font-weight: 600;
  overflow: hidden; white-space: nowrap;
  cursor: pointer; user-select: none;
  text-decoration: none;
  position: relative;
  z-index: 2;
  transition: filter .1s, transform .08s;
}
.pg-bar:hover { filter: brightness(1.06); z-index: 9; }
/* Pendant un glisser-déposer : les barres laissent passer la souris pour que
   le dépôt atteigne TOUJOURS la cellule-jour, même par-dessus une autre barre
   (sinon le geste était silencieusement avalé). */
.pg-dragging .pg-bar { pointer-events: none; }
/* Créneaux IMPORTÉS d'Odoo : motif hachuré par-dessus la couleur de statut,
   pour les distinguer d'un coup d'œil des créneaux natifs MASTERSALES
   (pleins). Le texte est relevé au-dessus du motif. */
.pg-bar--odoo::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(45deg, rgba(255,255,255,.32) 0 5px, transparent 5px 11px);
  pointer-events: none;
}
.pg-bar--odoo > * { position: relative; }
/* Prolongement d'un créneau après un week-end/férié libéré : même couleur,
   légèrement estompé et sans contenu (montre que le même créneau reprend). */
.pg-bar--cont { opacity: .72; cursor: default; pointer-events: none; }
.pg-bar--manual { cursor: grab; }
.pg-bar--manual:active { cursor: grabbing; transform: scaleY(.94); }
.pg-bar-t { font-weight: 700; overflow: hidden; text-overflow: ellipsis; }
/* Barre de rôle Odoo : le rôle est le seul texte → il prend toute la largeur
   disponible et s'ellipse proprement (min-width:0 requis en flex). */
.pg-bar-role { flex: 1 1 auto; min-width: 0; }
.pg-bar-s { opacity: .82; font-weight: 500; overflow: hidden; text-overflow: ellipsis; }
.pg-bar--conflict { outline: 2px solid var(--coral-text); outline-offset: -2px; }
/* Barre mission dont le bon est à renvoyer (mission changée après envoi). */
.pg-bar--stale { outline: 2px dashed var(--warning, #d98a00); outline-offset: -2px; }
.pg-bar-stale {
  flex: 0 0 auto; font-size: .62rem; font-weight: 700; letter-spacing: .01em;
  padding: 1px 5px; border-radius: 999px; white-space: nowrap;
  background: var(--warning, #d98a00); color: #fff; text-decoration: none;
}
/* Repère « issu d'une mission de Loïc » sur un créneau repris (prise de relais) */
.pg-bar-mission-tag {
  flex: 0 0 auto; font-size: .6rem; font-weight: 700; letter-spacing: .02em;
  text-transform: uppercase; padding: 1px 5px; border-radius: 999px; white-space: nowrap;
  background: rgba(255,255,255,.28); color: #fff; text-decoration: none;
}
.pg-bar-mission-tag:hover { background: rgba(255,255,255,.45); }
/* Statuts qui demandent une action DANS MASTERSALES (à compléter / à valider) :
   pulsation douce pour attirer l'œil, sans clignotement agressif. */
@keyframes pgActionPulse {
  0%   { box-shadow: 0 0 0 0 rgba(15,23,42,.42); }
  70%  { box-shadow: 0 0 0 5px rgba(15,23,42,0); }
  100% { box-shadow: 0 0 0 0 rgba(15,23,42,0); }
}
.pg-bar--action { animation: pgActionPulse 1.8s ease-in-out infinite; z-index: 6; }
.pg-legend-pulse { animation: pgActionPulse 1.8s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) {
  /* Pas d'animation : on garde un repère statique fort à la place. */
  .pg-bar--action { animation: none; outline: 2px solid rgba(15,23,42,.55); outline-offset: -2px; }
  .pg-legend-pulse { animation: none; }
}

.pg-bar-resize {
  position: absolute; right: 0; top: 0; bottom: 0; width: 6px;
  cursor: ew-resize; background: rgba(255,255,255,.25);
  opacity: 0; transition: opacity .1s;
}
.pg-bar--manual:hover .pg-bar-resize { opacity: 1; }

.pg-bar-validate { display: inline-flex; margin-left: auto; }
.pg-bar-validate button {
  background: rgba(255,255,255,.28); border: 0; color: #fff;
  width: 18px; height: 18px; border-radius: 5px; cursor: pointer;
  font-size: .7rem; line-height: 1; display: grid; place-items: center;
}
.pg-bar-validate button:hover { background: rgba(255,255,255,.45); }

/* Modal */
.pg-modal-overlay {
  position: fixed; inset: 0; background: rgba(15,23,42,.4);
  backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
  display: grid; place-items: center; z-index: 9000; padding: 20px;
  animation: fade .14s ease;
}
.pg-modal {
  background: var(--surface); border-radius: 16px; width: 100%; max-width: 420px;
  padding: 22px; box-shadow: var(--shadow-lg);
  display: grid; gap: 12px;
  animation: rise .18s ease;
  /* Popup plus haute que l'écran → elle défile à l'intérieur (sinon le bas,
     dont le bouton Enregistrer, était inaccessible). overscroll-behavior évite
     d'entraîner la page du dessous. */
  max-height: calc(100vh - 40px);
  max-height: calc(100dvh - 40px);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.pg-modal-head { display: flex; justify-content: space-between; align-items: flex-start; }
.pg-modal-eyebrow { font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); margin: 0; }
.pg-modal-head h3 { margin: 3px 0 0; font-size: 1.1rem; font-weight: 700; }
.pg-modal-x { background: var(--surface-2); border: 0; width: 30px; height: 30px; border-radius: 8px; font-size: 1.1rem; cursor: pointer; color: var(--text-soft); }
.pg-modal-x:hover { background: var(--surface-3); }
.pg-modal-form { display: grid; gap: 11px; }
.pg-field { display: grid; gap: 5px; font-size: .78rem; font-weight: 700; color: var(--text-soft); }
.pg-field i { font-weight: 400; font-style: normal; color: var(--text-muted); }
.pg-field input, .pg-field select, .pg-field textarea {
  padding: 9px 12px; border: 1.5px solid var(--border-strong); border-radius: 9px;
  font: inherit; font-size: .88rem; font-weight: 500; color: var(--text); background: var(--surface);
}
.pg-field input:focus, .pg-field select:focus, .pg-field textarea:focus { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }
.pg-field textarea { resize: vertical; min-height: 120px; font-size: .82rem; line-height: 1.5; }
.pg-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pg-check { display: flex; align-items: center; gap: 8px; font-size: .82rem; font-weight: 600; color: var(--text-soft); cursor: pointer; }
.pg-modal-actions { display: flex; gap: 8px; padding-top: 4px; flex-wrap: wrap; }
.pg-btn-primary {
  background: var(--accent); color: #fff; border: 0; border-radius: 9px;
  padding: 10px 20px; font-size: .88rem; font-weight: 600; cursor: pointer;
}
.pg-btn-primary:hover { background: var(--accent-dark); }
.pg-modal .pg-btn-ghost { background: var(--surface-2); color: var(--text-soft); }
.pg-modal .pg-btn-ghost:hover { background: var(--surface-3); }

/* Drop target highlight */
.pg-cell.pg-drop { background: rgba(0,113,227,.14) !important; }

/* Période peinte au glissé : l'aperçu de ce qui va être créé. Plus soutenu
   que la cible de dépôt — c'est une plage entière, il faut la lire d'un coup
   d'œil — pour qu'on voie où elle s'arrête devant une intervention déjà posée.
   Le liseré est en HAUT et en BAS seulement : bordé sur les quatre côtés, la
   plage se lisait comme cinq cases séparées au lieu d'une période. */
.pg-cell.pg-paint {
  background: rgba(0,113,227,.22) !important;
  box-shadow: inset 0 1px 0 rgba(0,113,227,.5), inset 0 -1px 0 rgba(0,113,227,.5);
}

/* ================================================================
   VUE RH — Dashboard techniciens (reconstruction propre)
   ================================================================ */
.rh-page { display: grid; gap: var(--gap-lg); }

/* Panneau de commande (en-tête + KPIs + onglets) */
.rh-command-panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-sm);
  padding: var(--gap-lg) var(--gap-lg) var(--gap-md);
  display: grid;
  gap: var(--gap-md);
}
.rh-command-copy h2 { font-size: 1.6rem; letter-spacing: -.03em; margin: 2px 0 4px; }
.rh-command-copy p { color: var(--text-soft); font-size: .9rem; max-width: 70ch; }

/* KPIs */
.rh-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: var(--gap-sm);
}
.rh-stat-card {
  display: grid;
  gap: 2px;
  align-content: start;
  padding: 12px 14px;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  text-align: left;
  font: inherit;
  cursor: default;
  transition: border-color var(--duration), background var(--duration), transform .08s;
}
button.rh-stat-card { cursor: pointer; }
/* Tuile-raccourci : même carte, mais elle emmène à sa section (2026-07-30). */
a.rh-stat-card-link { text-decoration: none; cursor: pointer; }
a.rh-stat-card-link:hover { border-color: rgba(0,113,227,.3); background: #fff; }
a.rh-stat-card-link:focus-visible { outline: 2px solid var(--accent, #0071E3); outline-offset: 2px; }
button.rh-stat-card:hover { border-color: rgba(0,113,227,.3); background: #fff; }
.rh-stat-card[aria-expanded="true"] { border-color: var(--accent); background: var(--accent-soft); }
.rh-stat-card span { font-size: .68rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--text-muted); }
.rh-stat-card strong { font-size: 1.7rem; font-weight: 700; letter-spacing: -.04em; line-height: 1.1; color: var(--text); }
.rh-stat-card p { font-size: .76rem; color: var(--text-soft); margin: 0; }

/* Panneaux détail (révélés au clic d'un KPI) */
.rh-dashboard-details { display: grid; gap: var(--gap-sm); }
.rh-dashboard-detail {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: var(--gap-md);
  animation: fade .18s ease;
}
.rh-dashboard-detail-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--gap-sm); }
.rh-dashboard-detail-head h3 { font-size: 1rem; margin: 2px 0 0; }
.rh-dashboard-detail-list { display: grid; gap: 4px; max-height: 340px; overflow-y: auto; }
.rh-dashboard-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: var(--gap-sm);
  padding: 8px 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
}
.rh-dashboard-row strong { font-size: .85rem; font-weight: 600; display: block; }
.rh-dashboard-row small { font-size: .72rem; color: var(--text-soft); }
.rh-dashboard-row p { font-size: .78rem; color: var(--text-soft); margin: 0; text-align: right; }

/* Pastille statut travail */
.rh-work-dot { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; background: var(--text-muted); display: inline-block; }
/* La couleur dépend du statut porté par la carte (.is-work-*) */
.rh-work-dot.is-idle,
.rh-technician-card.is-work-idle .rh-work-dot { background: var(--text-muted); }
.rh-work-dot.is-planned,
.rh-technician-card.is-work-planned .rh-work-dot { background: var(--green); box-shadow: 0 0 0 3px rgba(52,199,89,.18); }
.rh-work-dot.is-absent,
.rh-technician-card.is-work-absent .rh-work-dot { background: var(--coral); box-shadow: 0 0 0 3px rgba(255,59,48,.16); }
/* « 000 - PAS DE TRAVAIL » : techniciens qui veulent du boulot mais n'en ont pas → pastille rouge clignotante */
.rh-work-dot.is-no_work,
.rh-technician-card.is-work-no_work .rh-work-dot {
  background: var(--coral);
  animation: rhWorkBlink 1.1s ease-in-out infinite;
}
@keyframes rhWorkBlink {
  0%, 100% { opacity: 1; box-shadow: 0 0 0 3px rgba(255,59,48,.32); }
  50%      { opacity: .3; box-shadow: 0 0 0 6px rgba(255,59,48,0); }
}
@media (prefers-reduced-motion: reduce) {
  .rh-work-dot.is-no_work,
  .rh-technician-card.is-work-no_work .rh-work-dot { animation: none; box-shadow: 0 0 0 3px rgba(255,59,48,.20); }
}

/* Espace techniciens : calendrier + alertes + grille pool */
.rh-technician-workspace {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr);
  gap: var(--gap-lg);
  align-items: start;
}
.rh-technician-main-column { min-width: 0; }
.rh-technician-side-column { min-width: 0; }
.rh-technician-pool-section { grid-column: 1 / -1; scroll-margin-top: 16px; }
.rh-directory-layout-full { width: 100%; }

.rh-directory-panel { padding: var(--gap-lg); }
.rh-panel-actions { display: flex; align-items: center; gap: var(--gap-sm); flex-wrap: wrap; }

.rh-search-field {
  display: grid;
  gap: 5px;
  font-size: .78rem;
  font-weight: 700;
  color: var(--text-soft);
  margin: var(--gap-md) 0;
}
.rh-search-field input {
  padding: 10px 14px;
  border: 1.5px solid var(--border-strong);
  border-radius: var(--r-md);
  font-size: .9rem;
  font-weight: 500;
}
.rh-search-field input:focus { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }

/* Grille de cartes techniciens */
.rh-technician-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: var(--gap-sm);
}
.rh-technician-card {
  position: relative;
  display: grid;
  gap: var(--gap-sm);
  padding: 14px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  text-align: left;
  font: inherit;
  cursor: pointer;
  transition: border-color var(--duration), box-shadow var(--duration), transform .08s;
}
.rh-technician-card:hover { border-color: rgba(0,113,227,.3); box-shadow: var(--shadow-md); transform: translateY(-1px); }
.rh-technician-card.is-selected { border-color: var(--accent); box-shadow: 0 0 0 2px rgba(0,113,227,.15); }
.rh-technician-card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.rh-technician-card-rating { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.rh-technician-card-main { display: flex; align-items: center; gap: 10px; }
.rh-technician-card-main strong { font-size: .92rem; font-weight: 700; display: block; line-height: 1.25; }
.rh-technician-card-main small { font-size: .74rem; color: var(--text-soft); }
.rh-technician-photo-thumb { flex: 0 0 auto; width: 36px; height: 36px; border-radius: 50%; object-fit: cover; background: var(--surface-2); }
.rh-technician-photo-missing { display: grid; place-items: center; font-size: .95rem; border: 1px dashed var(--border); color: var(--text-muted); }
.rh-technician-card-bottom { display: grid; gap: 1px; }
.rh-technician-card-bottom span { font-size: .76rem; font-weight: 600; color: var(--text); }
.rh-technician-card-bottom small { font-size: .68rem; color: var(--text-muted); }
.rh-pool-toggle { margin-bottom: 12px; }
.rh-technician-card.is-dormant { opacity: .82; }
.rh-technician-card.is-dormant:hover { opacity: 1; }
.rh-card-last-activity { font-size: .68rem; color: var(--gold-text); font-weight: 600; }
.rh-score-pill {
  flex: none;
  font-size: .64rem;
  font-weight: 700;
  color: var(--text-soft);
  background: var(--surface-2);
  border-radius: var(--r-full);
  padding: 3px 9px;
  white-space: nowrap;
}

/* Étoiles de notation */
.rh-rating-stars { display: inline-flex; gap: 1px; font-size: .8rem; color: #d4d8de; }
.rh-rating-stars .is-filled { color: var(--gold); }

/* Type d'emploi (liseré gauche) */
.rh-technician-card.is-payroll { border-left: 3px solid var(--green); }
.rh-technician-card.is-subcontractor { border-left: 3px solid var(--teal); }

/* Calendrier RH */
.rh-calendar-panel { padding: var(--gap-lg); }
.rh-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 3px;
  margin-top: var(--gap-sm);
}
.rh-calendar-weekday { font-size: .66rem; font-weight: 700; text-transform: uppercase; color: var(--text-muted); text-align: center; padding: 4px 0; }
.rh-calendar-cell {
  min-height: 54px;
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  padding: 4px 5px;
  font-size: .74rem;
  background: var(--surface);
}
.rh-calendar-cell.is-empty { background: transparent; border: none; }
.rh-calendar-cell.is-weekend { background: var(--surface-2); }
.rh-calendar-cell.is-today { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.rh-calendar-cell.is-holiday { background: var(--gold-soft); }
.rh-calendar-cell.has-reminders { background: var(--accent-soft); }
.rh-calendar-holiday { font-size: .62rem; color: var(--gold); display: block; }
.rh-calendar-reminder-preview { font-size: .64rem; color: var(--accent); display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rh-calendar-reminder-more { font-size: .62rem; color: var(--text-muted); }

/* Alertes CDD */
.rh-alert-panel { padding: var(--gap-lg); }
.rh-alert-list { display: grid; gap: var(--gap-xs); margin-top: var(--gap-sm); }
.rh-cdd-alert {
  display: grid;
  gap: 2px;
  padding: 10px 12px;
  background: var(--gold-soft);
  border: 1px solid rgba(255,159,10,.25);
  border-radius: var(--r-sm);
  font-size: .82rem;
}

/* Responsive */
@media (max-width: 920px) {
  .rh-technician-workspace { grid-template-columns: 1fr; }
}

/* Barres synchronisées depuis Odoo (lecture seule) */
.pg-bar--odoo { cursor: default; }
.pg-bar-odoo-tag {
  font-size: .56rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  background: rgba(255,255,255,.28);
  color: #fff;
  padding: 1px 5px;
  border-radius: 4px;
  flex-shrink: 0;
}

/* ── Pop-up de réconciliation technicien ── */
.rh-recon-overlay {
  position: fixed; inset: 0; z-index: 9500;
  background: rgba(15,23,42,.45);
  backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
  display: grid; place-items: center; padding: 20px;
  animation: fade .14s ease;
}
.rh-recon-modal {
  background: var(--surface); border-radius: var(--r-lg); width: 100%; max-width: 440px;
  padding: 22px; box-shadow: var(--shadow-lg);
  display: grid; gap: 16px; animation: rise .18s ease;
}
.rh-recon-head { display: flex; justify-content: space-between; align-items: center; }
.rh-recon-head strong { font-size: 1.05rem; font-weight: 700; }
.rh-recon-x { background: var(--surface-2); border: 0; width: 30px; height: 30px; border-radius: var(--r-sm); font-size: 1.1rem; cursor: pointer; color: var(--text-soft); }
.rh-recon-x:hover { background: var(--surface-3); }
.rh-recon-name {
  display: grid; gap: 3px; padding: 14px 16px;
  background: var(--accent-soft); border: 1px solid rgba(0,113,227,.18); border-radius: var(--r-md);
}
.rh-recon-label { font-size: .68rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--accent); }
.rh-recon-value { font-size: 1.15rem; font-weight: 700; letter-spacing: -.01em; color: var(--text); }
.rh-recon-raw { font-size: .76rem; color: var(--text-muted); }
.rh-recon-warn {
  display: grid; gap: 8px; padding: 14px 16px;
  background: var(--gold-soft); border: 1px solid rgba(255,159,10,.3); border-radius: var(--r-md);
}
.rh-recon-warn strong { font-size: .9rem; color: var(--gold-text); }
.rh-recon-warn p { font-size: .8rem; color: var(--gold-text); margin: 0; }
.rh-recon-dups { display: grid; gap: 6px; }
.rh-recon-dup {
  display: flex; flex-direction: column; gap: 1px; text-align: left;
  padding: 8px 12px; background: var(--surface); border: 1px solid rgba(255,159,10,.35); border-radius: var(--r-sm); cursor: pointer;
  transition: border-color .12s, background .12s;
}
.rh-recon-dup:hover { border-color: var(--gold); background: var(--gold-soft); }
.rh-recon-dup-name { font-size: .86rem; font-weight: 700; color: var(--text); }
.rh-recon-dup-meta { font-size: .7rem; color: var(--gold-text); }
.rh-recon-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.rh-recon-confirm {
  background: var(--accent); color: #fff; border: 0; border-radius: var(--r-sm);
  padding: 11px 18px; font-size: .86rem; font-weight: 600; cursor: pointer; flex: 1;
}
.rh-recon-confirm:hover { background: var(--accent-dark); }
.rh-recon-ghost {
  background: var(--surface-2); color: var(--text-soft); border: 0; border-radius: var(--r-sm);
  padding: 11px 18px; font-size: .86rem; font-weight: 600; cursor: pointer;
}
.rh-recon-ghost:hover { background: var(--surface-3); }

/* ── Revue de réconciliation par lot ── */
.rh-recon-review { max-width: 620px; max-height: 82vh; display: flex; flex-direction: column; overflow: hidden; }
.rh-recon-review .rh-recon-head { flex: 0 0 auto; }
.rh-recon-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; display: grid; gap: 6px; padding-right: 4px; }
.rh-recon-item.rh-recon-removing { opacity: 0; transform: translateX(12px); transition: opacity .18s, transform .18s; }
.rh-recon-loading, .rh-recon-error, .rh-recon-ok { text-align: center; padding: 24px; color: var(--text-soft); }
.rh-recon-error { color: var(--coral-text); }
.rh-recon-ok { color: var(--green-text); font-weight: 600; }
.rh-recon-section {
  font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
  color: var(--text-soft); margin: 14px 0 4px; padding-bottom: 5px; border-bottom: 1px solid var(--border);
}
.rh-recon-section:first-child { margin-top: 0; }
.rh-recon-item {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 9px 12px; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--r-sm);
}
.rh-recon-dupitem { flex-direction: column; align-items: stretch; gap: 8px; }
.rh-recon-item-text { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: .86rem; }
.rh-recon-old { color: var(--text-muted); text-decoration: line-through; }
.rh-recon-arrow, .rh-recon-vs { color: var(--border-strong); font-weight: 700; }
.rh-recon-vs { color: var(--gold); }
.rh-recon-new { font-weight: 700; color: var(--text); }
.rh-recon-hint { font-size: .72rem; color: var(--gold-text); font-style: italic; }
.rh-recon-dup-choice { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.rh-recon-code-input {
  width: 70px; padding: 7px 9px; border: 1px solid var(--border-strong); border-radius: var(--r-xs); font-size: .85rem;
  text-transform: uppercase; text-align: center; font-weight: 600;
}
.rh-recon-apply {
  background: var(--accent); color: #fff; border: 0; border-radius: var(--r-xs);
  padding: 7px 14px; font-size: .8rem; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.rh-recon-apply:hover { background: var(--accent-dark); }
.rh-recon-apply:disabled { opacity: .6; cursor: default; }
.rh-recon-skip { padding: 7px 12px; font-size: .8rem; }
.rh-recon-done { background: var(--green-soft); border-color: rgba(52,199,89,.3); opacity: .85; }
.rh-recon-check { color: var(--green-text); font-weight: 700; font-size: .8rem; }

/* ───────────────────────────────────────────────────────────
   Onglet RH · Pool clients (refonte « Apple-like »)
   ─────────────────────────────────────────────────────────── */
.rh-client-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 14px;
  margin-top: var(--gap-sm);
}
.rh-client-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 18px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  text-align: left;
  font: inherit;
  cursor: pointer;
  -webkit-backdrop-filter: saturate(1.4) blur(8px);
  backdrop-filter: saturate(1.4) blur(8px);
  transition: transform .18s cubic-bezier(.2,.7,.2,1),
              box-shadow .18s ease, border-color .18s ease;
}
.rh-client-card:hover {
  transform: translateY(-3px);
  border-color: rgba(0,113,227,.28);
  box-shadow: var(--shadow-md);
}
.rh-client-card:active { transform: translateY(-1px) scale(.995); }
.rh-client-card.is-selected {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(0,113,227,.16), var(--shadow-md);
}

/* En-tête : pastille + nom + statut */
.rh-client-card-head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
}
.rh-client-avatar {
  display: grid;
  place-items: center;
  width: 44px; height: 44px;
  border-radius: var(--r-full);
  background: linear-gradient(145deg, var(--surface-2), var(--surface-3));
  color: var(--text-soft);
  font-size: .9rem;
  font-weight: 700;
  letter-spacing: .02em;
  flex: none;
}
.rh-client-avatar.is-code {
  background: linear-gradient(145deg, #0A84FF, var(--accent));
  color: #fff;
  box-shadow: 0 4px 12px rgba(0,113,227,.28);
  font-size: .82rem;
}
.rh-client-card-title { min-width: 0; display: grid; gap: 2px; }
.rh-client-card-title strong {
  font-size: .98rem;
  font-weight: 650;
  line-height: 1.25;
  letter-spacing: -.01em;
  color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rh-client-card-title small {
  font-size: .74rem;
  color: var(--text-muted);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rh-client-status {
  width: 9px; height: 9px;
  border-radius: var(--r-full);
  background: var(--text-muted);
  opacity: .45;
  flex: none;
}
.rh-client-card.is-active .rh-client-status {
  background: var(--green);
  opacity: 1;
  box-shadow: 0 0 0 3px rgba(52,199,89,.18);
}

/* Métriques : 4 colonnes lisibles */
.rh-client-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  padding: 12px 0 2px;
  border-top: 1px solid var(--border);
}
.rh-client-metric {
  display: grid;
  gap: 1px;
  justify-items: center;
  font-size: .64rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--text-muted);
}
.rh-client-metric b {
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--text);
}
.rh-client-metric:has(b:not(:empty)) { color: var(--text-muted); }

/* Pied : pastille documents */
.rh-client-card-foot { display: flex; gap: 6px; flex-wrap: wrap; }
.rh-client-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: .7rem;
  font-weight: 600;
  color: var(--accent);
  background: rgba(0,113,227,.08);
  border-radius: var(--r-full);
  padding: 4px 10px;
}
.rh-client-chip i {
  width: 5px; height: 5px;
  border-radius: var(--r-full);
  background: var(--accent);
}
.rh-client-chip.is-warn { color: var(--gold-text); background: var(--gold-soft); }
.rh-client-chip.is-warn i { background: var(--gold); }
.rh-client-card.is-doc-alert { border-color: rgba(255,159,10,.4); box-shadow: 0 0 0 1px rgba(255,159,10,.2); }

/* Signalements terrain (onglet RH) */
.rh-report-chips { display: flex; gap: 8px; flex-wrap: wrap; margin: 4px 0 16px; }
.rh-report-chip { display: inline-flex; align-items: center; padding: 7px 14px; border-radius: var(--r-full); background: var(--surface-2); color: var(--text-soft); font-size: .82rem; font-weight: 600; }
.rh-report-chip:hover { background: var(--surface-3); }
.rh-report-chip.is-active { background: var(--accent); color: #fff; }
.rh-report-list { display: grid; gap: 12px; }
.rh-report-card { padding: 16px 18px; border-radius: var(--r-lg); border: 1px solid var(--border); background: var(--surface); display: grid; gap: 8px; }
.rh-report-card.is-nouveau { border-color: rgba(255,159,10,.35); background: var(--gold-soft); }
.rh-report-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.rh-report-category { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); }
.rh-report-status { font-size: .72rem; font-weight: 700; padding: 3px 10px; border-radius: var(--r-full); background: var(--surface-2); color: var(--text-soft); }
.rh-report-status.is-nouveau { background: var(--gold-soft); color: var(--gold-text); }
.rh-report-status.is-en_cours { background: var(--accent-soft); color: var(--accent); }
.rh-report-status.is-resolu { background: var(--green-soft); color: var(--green-text); }
.rh-report-card strong { font-size: 1rem; }
.rh-report-meta { font-size: .78rem; color: var(--text-soft); }
.rh-report-description { font-size: .9rem; color: var(--text); margin: 0; line-height: 1.5; }
.rh-report-resolution { font-size: .82rem; color: var(--text-soft); background: var(--surface-2); border-radius: var(--r-sm); padding: 8px 10px; margin: 0; }
.rh-report-form { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 4px; }
.rh-report-form select { padding: 8px 10px; border-radius: var(--r-sm); border: 1px solid var(--border-strong); font-size: .84rem; }
.rh-report-form input[type="text"] { flex: 1 1 180px; padding: 8px 10px; border-radius: var(--r-sm); border: 1px solid var(--border-strong); font-size: .84rem; }
.rh-report-save { padding: 8px 16px; border-radius: var(--r-sm); border: 0; background: var(--accent); color: #fff; font-weight: 600; font-size: .84rem; cursor: pointer; }
.rh-report-save:hover { background: var(--accent-dark); }

.rh-broadcast-panel { margin-bottom: 16px; }
.rh-broadcast-form { display: flex; gap: 10px; align-items: flex-start; margin-top: 4px; }
.rh-broadcast-form textarea { flex: 1 1 auto; padding: 10px 12px; border-radius: var(--r-md); border: 1px solid var(--border-strong); font-size: .9rem; resize: vertical; font-family: inherit; }
.rh-broadcast-hint { font-size: .76rem; color: var(--text-muted); margin: 8px 0 0; }

/* Achats & matériel (onglet RH) */
/* Import de facture fournisseur (OCR) */
.rh-invoice-panel { margin-bottom: var(--gap-md); }
.rh-invoice-import { display: flex; align-items: stretch; gap: 12px; flex-wrap: wrap; }
.rh-invoice-drop {
  flex: 1 1 320px; display: grid; gap: 3px; place-items: center; text-align: center; cursor: pointer;
  padding: 18px 16px; border: 1.5px dashed rgba(0,113,227,.4); border-radius: var(--r-lg);
  background: rgba(0,113,227,.04); transition: background .14s, border-color .14s;
}
.rh-invoice-drop:hover { background: rgba(0,113,227,.09); border-color: var(--accent); }
.rh-invoice-drop strong { font-size: .92rem; color: var(--text); }
.rh-invoice-drop span { font-size: .78rem; color: var(--text-soft); }
.rh-invoice-drop input[type=file] { margin-top: 6px; font-size: .8rem; }
.rh-invoice-import .primary-button { align-self: center; }
.rh-purchase-invoice {
  justify-self: start; font-size: .8rem; font-weight: 650; color: var(--accent-dark);
  text-decoration: none; padding: 4px 10px; border-radius: var(--r-full); background: var(--accent-soft);
}
.rh-purchase-invoice:hover { text-decoration: underline; }

.rh-purchase-list { display: grid; gap: 12px; }
.rh-purchase-card { padding: 16px 18px; border-radius: var(--r-lg); border: 1px solid var(--border); background: var(--surface); display: grid; gap: 8px; }
.rh-purchase-card.is-nouveau { border-color: rgba(255,159,10,.35); background: var(--gold-soft); }
.rh-purchase-card.is-commande { border-color: rgba(0,113,227,.3); background: var(--accent-soft); }
.rh-purchase-card.is-recu { border-color: rgba(52,199,89,.3); background: var(--green-soft); }
.rh-purchase-card.is-annule { opacity: .6; }
.rh-purchase-head { display: flex; align-items: center; justify-content: flex-end; }
.rh-purchase-status { font-size: .72rem; font-weight: 700; padding: 3px 10px; border-radius: var(--r-full); background: var(--surface-2); color: var(--text-soft); }
.rh-purchase-status.is-nouveau { background: var(--gold-soft); color: var(--gold-text); }
.rh-purchase-status.is-commande { background: var(--accent-soft); color: var(--accent); }
.rh-purchase-status.is-recu { background: var(--green-soft); color: var(--green-text); }
.rh-purchase-card strong { font-size: 1rem; }
.rh-purchase-meta { font-size: .78rem; color: var(--text-soft); }
.rh-purchase-description { font-size: .9rem; color: var(--text); margin: 0; line-height: 1.5; }
.rh-purchase-form { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 4px; }
.rh-purchase-form input, .rh-purchase-form select { padding: 8px 10px; border-radius: var(--r-sm); border: 1px solid var(--border-strong); font-size: .84rem; }
.rh-purchase-form button { grid-column: 1 / -1; justify-self: start; }

.rh-purchase-nav { display: flex; gap: 8px; align-items: center; margin-bottom: 14px; }
.rh-purchase-nav-link { padding: 7px 14px; border-radius: var(--r-full); background: var(--surface-2); color: var(--text-soft); font-size: .82rem; font-weight: 600; text-decoration: none; }
.rh-purchase-nav-link:hover { background: var(--surface-3); }
.rh-purchase-nav-link.is-active { background: var(--accent); color: #fff; }
.rh-purchase-nav-export { margin-left: auto; background: transparent; border: 1px dashed var(--border-strong); }

.rh-supplier-list { display: grid; gap: 12px; }
.rh-supplier-card { padding: 14px 16px; border-radius: var(--r-lg); border: 1px solid var(--border); background: var(--surface); }
.rh-supplier-card.is-new { border-style: dashed; }
.rh-supplier-card.is-inactive { opacity: .55; }
.rh-supplier-form { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; align-items: center; }
.rh-supplier-form input { padding: 8px 10px; border-radius: var(--r-sm); border: 1px solid var(--border-strong); font-size: .84rem; }
.rh-supplier-active { display: flex; align-items: center; gap: 6px; font-size: .82rem; color: var(--text-soft); }
.rh-supplier-active input { width: auto; padding: 0; }
.rh-supplier-form button { grid-column: 1 / -1; justify-self: start; }

/* Conformité (onglet RH) */
.rh-conformity-list { display: grid; gap: 12px; }
.rh-conformity-card { padding: 16px 18px; border-radius: var(--r-lg); border: 1px solid var(--border); background: var(--surface); display: grid; gap: 8px; }
.rh-conformity-card.is-alert { border-color: rgba(255,159,10,.35); background: var(--gold-soft); }
.rh-conformity-card.is-expired { border-color: rgba(255,59,48,.3); background: var(--coral-soft); }
.rh-conformity-head { display: flex; align-items: center; justify-content: flex-end; }
.rh-conformity-badge { font-size: .72rem; font-weight: 700; padding: 3px 10px; border-radius: var(--r-full); background: var(--surface-2); color: var(--text-soft); }
.rh-conformity-badge.is-alert { background: var(--gold-soft); color: var(--gold-text); }
.rh-conformity-badge.is-expired { background: var(--coral-soft); color: var(--coral-text); }
.rh-conformity-card strong { font-size: 1rem; }
.rh-conformity-meta { font-size: .78rem; color: var(--text-soft); }
.rh-conformity-detail { font-size: .9rem; color: var(--text); margin: 0; font-weight: 600; }
.rh-conformity-link { font-size: .84rem; color: var(--accent); font-weight: 600; text-decoration: none; }
.rh-conformity-link:hover { text-decoration: underline; }

/* Alerte conformité documents clients (contrat + offre de prix) */
/* Alerte prioritaire : technicien non répertorié en intervention (enjeu sécurité) */
.rh-unlisted-alert { border: 1.5px solid rgba(255,59,48,.45); background: linear-gradient(180deg, var(--coral-soft), var(--surface)); box-shadow: 0 0 0 4px rgba(255,59,48,.08); animation: rhUnlistedPulse 2s ease-in-out infinite; }
@keyframes rhUnlistedPulse { 0%,100% { box-shadow: 0 0 0 4px rgba(255,59,48,.08); } 50% { box-shadow: 0 0 0 6px rgba(255,59,48,.16); } }
@media (prefers-reduced-motion: reduce) { .rh-unlisted-alert { animation: none; } }
.rh-unlisted-head { display: flex; align-items: flex-start; gap: var(--gap-sm); margin-bottom: var(--gap-md); }
.rh-unlisted-icon { flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%; background: var(--coral); color: #fff; font-weight: 800; font-size: 1.1rem; display: grid; place-items: center; }
.rh-unlisted-head h3 { margin: 2px 0; color: var(--coral-text); }
.rh-unlisted-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--gap-sm); }
.rh-unlisted-row { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 12px 14px; border: 1px solid rgba(255,59,48,.25); border-radius: var(--r-md); background: var(--surface); cursor: pointer; text-align: left; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.rh-unlisted-row:hover { border-color: var(--coral); box-shadow: 0 4px 14px rgba(0,0,0,.07); transform: translateY(-1px); }
.rh-unlisted-name { font-size: .92rem; font-weight: 700; }
.rh-unlisted-client { font-size: .76rem; color: var(--text-soft); }
.rh-unlisted-cta { margin-top: 6px; font-size: .76rem; font-weight: 700; color: var(--coral); }
.rh-unlisted-cta i { font-style: normal; }

.rh-client-doc-alert { border: 1px solid rgba(255,159,10,.35); background: linear-gradient(180deg, var(--gold-soft), var(--surface)); }
.rh-client-doc-alert-head { display: flex; align-items: flex-start; gap: var(--gap-sm); margin-bottom: var(--gap-md); }
.rh-client-doc-alert-icon { flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; background: var(--gold, var(--gold)); color: #fff; font-weight: 800; display: grid; place-items: center; font-size: 1.05rem; }
.rh-client-doc-alert-head h3 { margin: 2px 0; }
.rh-client-doc-alert-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--gap-sm); }
.rh-client-doc-alert-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); cursor: pointer; text-align: left; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.rh-client-doc-alert-row:hover { border-color: var(--gold, var(--gold)); box-shadow: 0 4px 14px rgba(0,0,0,.06); transform: translateY(-1px); }
.rh-client-doc-alert-name { font-size: .82rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rh-doc-missing-tags { display: inline-flex; gap: 4px; flex: 0 0 auto; }
.rh-doc-missing-tag { font-size: .6rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--gold-text); background: var(--gold-soft); padding: 2px 7px; border-radius: var(--r-full); white-space: nowrap; }

/* Bandeau d'alerte dans la fiche client */
.rh-client-detail-alert { display: flex; align-items: flex-start; gap: 10px; padding: 11px 13px; margin-bottom: var(--gap-md); border-radius: var(--r-md); background: var(--gold-soft); border-left: 3px solid var(--gold, var(--gold)); }
.rh-client-detail-alert strong { display: block; font-size: .85rem; color: var(--gold-text); }
.rh-client-detail-alert p { margin: 3px 0 0; font-size: .76rem; color: var(--text-soft); }

@media (max-width: 560px) {
  .rh-client-grid { grid-template-columns: 1fr; }
}

/* Simulation contrat — coût employeur */
.rh-sim-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: var(--gap-lg); align-items: start; }
.rh-sim-choice-grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: var(--gap-sm); }
.rh-sim-select { display: flex; flex-direction: column; gap: 4px; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--text-muted); }
.rh-sim-select select { font-size: .9rem; font-weight: 600; text-transform: none; letter-spacing: 0; color: var(--text); padding: 9px 12px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface-2); }
.rh-sim-cp-note { margin: 8px 0 0; color: var(--gold-text); }
.rh-sim-cp-note:empty { display: none; }
.rh-sim-brut-block { margin-top: var(--gap-md); padding-top: var(--gap-md); border-top: 1px solid var(--border); }
.rh-sim-brut-block .eyebrow { margin-bottom: 6px; }
.rh-sim-base-note { font-size: .76rem; color: var(--text-soft); margin: 0 0 var(--gap-sm); }
.rh-sim-mode { display: inline-flex; gap: 4px; padding: 3px; background: var(--surface-2); border-radius: var(--r-full); margin-bottom: var(--gap-sm); }
.rh-sim-mode-btn { border: 0; background: none; padding: 6px 14px; border-radius: var(--r-full); font-size: .78rem; font-weight: 600; color: var(--text-soft); cursor: pointer; }
.rh-sim-mode-btn.is-active { background: var(--surface); color: var(--accent); box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,.08)); }
.rh-sim-family { margin-top: var(--gap-sm); }
.rh-sim-hours { display: flex; align-items: center; gap: 6px; margin-top: var(--gap-sm); font-size: .78rem; color: var(--text-soft); }
.rh-sim-hours input { width: 64px; text-align: right; padding: 5px 8px; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface-2); font-weight: 600; }
.rh-sim-hourly { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; margin: 0 0 var(--gap-sm); padding: 10px 12px; background: var(--surface-2); border-radius: var(--r-md); }
.rh-sim-hourly-label { font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); width: 100%; }
.rh-sim-hourly-stat { font-size: .82rem; color: var(--text-soft); }
.rh-sim-hourly-stat b { font-size: .95rem; color: var(--text); font-variant-numeric: tabular-nums; }
.rh-sim-hourly-stat.is-primary b { color: var(--accent); }
.rh-sim-levels .rh-sim-headline-card em { display: block; font-style: normal; font-size: .6rem; color: var(--text-muted); margin-top: 2px; }
.rh-sim-levels .rh-sim-headline-card.is-primary em { color: rgba(255,255,255,.8); }
.rh-sim-meta-line { font-size: .8rem; color: var(--text-soft); margin: 0 0 var(--gap-sm); }
.rh-sim-meta-line span { font-weight: 700; color: var(--text); }
.rh-sim-worker { margin-top: var(--gap-md); padding-top: var(--gap-md); border-top: 1px dashed var(--border); }
.rh-sim-worker-table { margin-top: 0; }
.rh-sim-worker-table th:last-child, .rh-sim-worker-table td:last-child { text-align: right; }
.rh-sim-worker-table tfoot td { color: var(--green); }
.rh-sim-brut-field { display: flex; align-items: baseline; gap: 10px; }
.rh-sim-brut-field input { width: 100%; font-size: 2rem; font-weight: 700; letter-spacing: -.03em; padding: 10px 14px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface-2); }
.rh-sim-brut-unit { font-size: .9rem; color: var(--text-muted); white-space: nowrap; }
.rh-sim-presets { display: flex; flex-wrap: wrap; gap: 8px; margin-top: var(--gap-sm); }
.rh-sim-preset { padding: 7px 14px; border: 1px solid var(--border); border-radius: var(--r-full); background: var(--surface); font-size: .8rem; font-weight: 600; cursor: pointer; transition: border-color .15s ease, background .15s ease; }
.rh-sim-preset:hover { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
.rh-sim-params-box { margin-top: var(--gap-md); border-top: 1px solid var(--border); padding-top: var(--gap-sm); }
.rh-sim-params-box > summary { cursor: pointer; font-size: .82rem; font-weight: 600; color: var(--accent); list-style: none; }
.rh-sim-params-box > summary::-webkit-details-marker { display: none; }
.rh-sim-param-grid { display: grid; gap: var(--gap-sm); margin-top: var(--gap-sm); }
.rh-sim-param { display: flex; align-items: center; justify-content: space-between; gap: var(--gap-sm); }
.rh-sim-param > span:first-child { display: flex; flex-direction: column; font-size: .82rem; font-weight: 600; }
.rh-sim-param small { font-size: .68rem; font-weight: 400; color: var(--text-muted); }
.rh-sim-param-input { display: inline-flex; align-items: center; gap: 5px; font-size: .82rem; color: var(--text-muted); white-space: nowrap; }
.rh-sim-param-input input { width: 72px; text-align: right; padding: 6px 8px; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface-2); font-weight: 600; }

.rh-sim-headline { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: var(--gap-sm); margin-bottom: var(--gap-md); }
.rh-sim-headline-card { padding: var(--gap-md); border-radius: var(--r-lg); background: var(--surface-2); border: 1px solid var(--border); display: grid; gap: 4px; }
.rh-sim-headline-card span { font-size: .64rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--text-muted); }
.rh-sim-headline-card strong { font-size: 1.4rem; letter-spacing: -.03em; }
.rh-sim-headline-card.is-primary { background: var(--accent); border-color: var(--accent); }
.rh-sim-headline-card.is-primary span { color: rgba(255,255,255,.85); }
.rh-sim-headline-card.is-primary strong { color: #fff; }
.rh-sim-breakdown { width: 100%; border-collapse: collapse; font-size: .84rem; }
.rh-sim-breakdown th { text-align: left; font-size: .64rem; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); padding: 6px 8px; border-bottom: 1px solid var(--border); }
.rh-sim-breakdown th:last-child, .rh-sim-breakdown td:last-child { text-align: right; }
.rh-sim-breakdown td { padding: 9px 8px; border-bottom: 1px solid var(--border); }
.rh-sim-breakdown .rh-sim-pct { color: var(--text-muted); font-size: .78rem; }
.rh-sim-breakdown .rh-sim-amount { font-weight: 600; font-variant-numeric: tabular-nums; }
.rh-sim-breakdown .rh-sim-base td { color: var(--text-soft); }
.rh-sim-breakdown tfoot td { padding: 11px 8px; font-weight: 800; font-size: .95rem; border-top: 2px solid var(--text); border-bottom: 0; }
.rh-sim-disclaimer { margin-top: var(--gap-md); }

@media (max-width: 820px) {
  .rh-sim-layout { grid-template-columns: 1fr; }
}

/* ───────────────────────────────────────────────────────────
   Modale RH (technicien & client) + fiche client « Apple-like »
   ─────────────────────────────────────────────────────────── */
.rh-modal {
  position: fixed; inset: 0; z-index: 9000;
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
  animation: rhModalFade .18s ease;
}
.rh-modal[hidden] { display: none; }
@keyframes rhModalFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes rhModalRise { from { opacity: 0; transform: translateY(16px) scale(.985); } to { opacity: 1; transform: none; } }

.rh-modal-backdrop {
  position: absolute; inset: 0;
  background: rgba(20,20,30,.32);
  -webkit-backdrop-filter: saturate(1.3) blur(10px);
  backdrop-filter: saturate(1.3) blur(10px);
  border: 0; padding: 0; cursor: pointer;
}
.rh-modal-card {
  position: relative;
  width: min(720px, 100%);
  max-height: 88vh;
  overflow-y: auto;
  overflow-x: hidden;
  box-sizing: border-box;
  background: var(--surface);
  border-radius: 24px;
  box-shadow: 0 24px 70px rgba(0,0,0,.28), 0 4px 14px rgba(0,0,0,.12);
  padding: 28px;
  animation: rhModalRise .22s cubic-bezier(.2,.7,.2,1);
  -webkit-overflow-scrolling: touch;
}
.rh-modal-card * { min-width: 0; }

/* Fiches demandées au clic (2026-07-29) : l'attente et l'échec doivent SE VOIR.
   Une fenêtre qui s'ouvre vide se lit comme « il n'y a rien », pas comme
   « ça charge » ni comme « ça a raté ». */
.rh-fiche-loading,
.rh-fiche-error {
  margin: 0;
  padding: var(--gap-lg) var(--gap-md);
  text-align: center;
  font-size: 0.95rem;
}
.rh-fiche-loading { color: var(--text-soft); }
.rh-fiche-loading::before {
  content: "";
  display: block;
  width: 20px; height: 20px;
  margin: 0 auto var(--gap-sm);
  border: 2px solid var(--border);
  border-top-color: var(--blue);
  border-radius: 50%;
  animation: rh-fiche-spin 700ms linear infinite;
}
@keyframes rh-fiche-spin { to { transform: rotate(360deg); } }
.rh-fiche-error { color: var(--coral); }
@media (prefers-reduced-motion: reduce) {
  .rh-fiche-loading::before { animation: none; }
}
.rh-modal-close {
  position: sticky; top: 0; float: right;
  display: grid; place-items: center;
  width: 32px; height: 32px;
  margin: -8px -8px 0 0;
  border-radius: var(--r-full);
  background: var(--surface-2); color: var(--text-soft);
  font-size: 1.1rem; line-height: 1; border: 0; cursor: pointer;
  transition: background .14s, color .14s;
  z-index: 2;
}
.rh-modal-close:hover { background: var(--surface-3); color: var(--text); }

/* Fiche : structure générale */
/* ===== Fiche technicien & client — refonte (hiérarchie : hero → coup d'œil → infos → suivi) ===== */
.rh-fiche { display: grid; gap: 14px; }
.rh-modal-card .rh-fiche { width: 100%; }
.rh-fiche-hero { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; padding: 2px 0 14px; border-bottom: 1px solid var(--border); }
.rh-fiche-photo { width: 60px; height: 60px; border-radius: 16px; object-fit: cover; background: var(--surface-2); border: 1px solid var(--border); display: inline-flex; align-items: center; justify-content: center; font-size: 1.5rem; color: var(--text-muted, #98989d); flex: 0 0 auto; }
.rh-fiche-hero-id { min-width: 0; }
.rh-fiche-hero-id .eyebrow { margin: 0 0 1px; }
.rh-fiche-hero-id h3 { margin: 0; font-size: 1.18rem; font-weight: 700; letter-spacing: -.02em; }
.rh-fiche-hero-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
.rh-tag { display: inline-flex; align-items: center; gap: 4px; font-size: .72rem; font-weight: 600; padding: 3px 9px; border-radius: 999px; background: var(--surface-2); color: var(--text-soft); border: 1px solid var(--border); }
.rh-tag.is-trade { color: var(--accent-text, #0a5dc2); background: rgba(0,113,227,.08); border-color: rgba(0,113,227,.22); }
.rh-tag .trade-icon { margin-right: 0; color: inherit; opacity: 1; }
.rh-fiche-vitals { display: grid; grid-template-columns: repeat(auto-fit, minmax(112px, 1fr)); gap: 8px; }
.rh-vital { background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 9px 11px; display: grid; gap: 2px; }
.rh-vital span { font-size: .62rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted, #98989d); }
.rh-vital strong { font-size: .9rem; font-weight: 700; color: var(--text); }
.rh-fiche-section { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 14px 15px; display: grid; gap: 12px; box-shadow: var(--shadow-sm, 0 1px 2px rgba(0,0,0,.04)); }
.rh-fiche-section-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.rh-fiche-section-head h4 { margin: 0; font-size: .96rem; font-weight: 700; letter-spacing: -.01em; }
.rh-chip-soft { font-size: .72rem; font-weight: 600; color: var(--text-soft); background: var(--surface-2); border-radius: 999px; padding: 3px 10px; white-space: nowrap; }
.rh-fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: 8px; min-inline-size: 0; }
.rh-fieldset + .rh-fieldset { margin-top: 4px; padding-top: 12px; border-top: 1px dashed var(--border); }
.rh-fieldset > legend { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted, #98989d); padding: 0; }
.rh-fieldset > legend small { font-weight: 500; text-transform: none; letter-spacing: 0; }
.rh-fiche .rh-edit-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(158px, 1fr)); gap: 9px 11px; }
.rh-fiche .rh-contract-block, .rh-fiche .rh-cost-field { grid-column: 1 / -1; }
.rh-add-block { border: 1px dashed var(--border); border-radius: 10px; background: var(--surface-2); }
.rh-add-block > summary { cursor: pointer; list-style: none; font-size: .8rem; font-weight: 650; color: var(--accent-text, #0a5dc2); padding: 9px 12px; }
.rh-add-block > summary::marker, .rh-add-block > summary::-webkit-details-marker { display: none; }
.rh-add-block[open] > summary { border-bottom: 1px solid var(--border); }
.rh-add-block > form { padding: 12px; margin: 0; }
/* Fiche client : uniformiser les encarts hérités (Interlocuteurs, CRM) avec les
   sections refonte — mêmes cartes blanches que « Coordonnées & identité ». */
.rh-fiche .rh-context-box { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 15px; box-shadow: var(--shadow-sm, 0 1px 2px rgba(0,0,0,.04)); gap: 12px; }
.rh-fiche .rh-client-detail-alert { border-radius: 14px; }
/* ===== Lot B : bandeau d'application unifié (remplace les barres latérales) ===== */
.appband { position: sticky; top: 0; z-index: 40; display: flex; align-items: center; gap: 11px; padding: 8px 18px; background: #0a2a39; color: #fff; box-shadow: 0 2px 12px rgba(0,0,0,.18); flex-wrap: wrap; }
.appband-brand { display: inline-flex; align-items: center; }
.appband-brand img { height: 22px; display: block; }
.appband-grid { color: #fff; text-decoration: none; font-size: 1.12rem; line-height: 1; padding: 5px 9px; border-radius: 8px; }
.appband-grid:hover { background: rgba(255,255,255,.12); }
.appband-app { display: inline-flex; align-items: center; gap: 7px; font-size: .93rem; white-space: nowrap; }
.appband-app svg { width: 17px; height: 17px; }
.appband-app strong { font-weight: 700; letter-spacing: -.01em; }
/* Fil d'Ariane : Accueil › App › Sous-page (remonter d'une étape sans ressortir) */
.appband-crumbs { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.appband-crumbs .crumb { display: inline-flex; align-items: center; gap: 6px; font-size: .9rem; white-space: nowrap; border-radius: 8px; padding: 4px 8px; text-decoration: none; }
.appband-crumbs .crumb svg { width: 16px; height: 16px; }
.appband-crumbs a.crumb { color: rgba(255,255,255,.74); }
.appband-crumbs a.crumb:hover { background: rgba(255,255,255,.12); color: #fff; }
.appband-crumbs .crumb-current { color: #fff; font-weight: 700; }
.appband-crumbs .crumb-home { font-weight: 600; }
.appband-crumbs .crumb-sep { color: rgba(255,255,255,.4); font-size: .95rem; }
.appband-pill { display: inline-flex; align-items: center; font-size: .74rem; font-weight: 600; padding: 3px 9px; border-radius: 999px; background: rgba(255,255,255,.14); color: #fff; white-space: nowrap; }
.appband-link { color: #fff; text-decoration: none; font-size: .83rem; font-weight: 600; padding: 6px 10px; border-radius: 8px; background: rgba(255,255,255,.12); white-space: nowrap; }
.appband-link:hover { background: rgba(255,255,255,.2); }
.sv-draft-note { margin: 0 0 10px; padding: 9px 12px; border-radius: 10px; background: #fff7ed; border: 1px solid #fed7aa; color: #9a3412; font-size: .84rem; font-weight: 600; }
.sv-draft-discard { margin-left: 6px; border: 1px solid #fdba74; background: #fff; color: #9a3412; font-size: .78rem; font-weight: 700; padding: 3px 9px; border-radius: 999px; cursor: pointer; }
.sv-draft-discard:hover { background: #ffedd5; }
.appband-tabs { display: flex; align-items: center; gap: 2px; overflow-x: auto; scrollbar-width: thin; }
.appband-tabs a { color: rgba(255,255,255,.76); text-decoration: none; font-size: .83rem; font-weight: 600; padding: 6px 10px; border-radius: 8px; white-space: nowrap; }
.appband-tabs a:hover { background: rgba(255,255,255,.1); color: #fff; }
.appband-tabs a.is-active { background: rgba(255,255,255,.17); color: #fff; }
.appband-spacer { flex: 1; }
.appband .notification-button { background: rgba(255,255,255,.12); color: #fff; border: 0; }
.appband .notification-button:hover { background: rgba(255,255,255,.2); }
.appband-user { font-size: .83rem; font-weight: 600; opacity: .92; white-space: nowrap; }
.appband .ghost-button { color: #fff; border-color: rgba(255,255,255,.28); background: transparent; }
.appband .ghost-button:hover { background: rgba(255,255,255,.12); }
.appband-viewas { position: relative; }
.appband-viewas > summary { list-style: none; cursor: pointer; font-size: .83rem; font-weight: 600; padding: 6px 10px; border-radius: 8px; background: rgba(255,255,255,.1); white-space: nowrap; }
.appband-viewas > summary::marker, .appband-viewas > summary::-webkit-details-marker { display: none; }
.appband-viewas > summary:hover { background: rgba(255,255,255,.18); }
/* Le sélecteur « voir comme » réutilise ses styles de la sidebar sombre → pop sombre */
.appband-viewas-pop { position: absolute; right: 0; top: calc(100% + 8px); background: #0f3347; border: 1px solid rgba(255,255,255,.14); border-radius: 12px; padding: 12px; box-shadow: 0 14px 34px rgba(0,0,0,.3); min-width: 240px; z-index: 60; }
.appband-desc { margin: 14px 0 0; color: var(--text-soft); font-size: .88rem; }
.appband-main { padding: 16px 22px 44px; max-width: 1560px; margin: 0 auto; width: 100%; box-sizing: border-box; position: relative; z-index: 1; }
/* Le tiroir de notifications doit passer AU-DESSUS du bandeau sticky (z 40) */
.notification-drawer { z-index: 50; }
@media (max-width: 720px) {
  .appband { gap: 8px; padding: 8px 12px; }
  .appband-user { display: none; }
  .appband-main { padding: 12px 12px 40px; }
}

/* ===== Lanceur d'applications (accueil type Odoo, charte claire) ===== */
.apps-launcher { min-height: 100vh; display: flex; flex-direction: column; position: relative; z-index: 1; }
.apps-topbar { display: flex; justify-content: space-between; align-items: center; padding: 18px 26px; }
/* Logo 2026 bleu sur fond TRANSPARENT (demande Thomas 2026-08-03) : plus
   de pastille sombre, la marque vit directement sur le fond clair. */
.apps-brand { display: inline-flex; align-items: center; }
.apps-brand img { height: 30px; display: block; }
.apps-user { display: flex; align-items: center; gap: 10px; font-weight: 600; color: var(--text); }
.apps-flash { max-width: 640px; margin: 0 auto 4px; }
.apps-grid-wrap { flex: 1; display: flex; align-items: flex-start; justify-content: center; padding: 7vh 20px 48px; }
.apps-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 138px)); gap: 30px 26px; justify-content: center; max-width: 920px; width: 100%; }
.app-tile { display: grid; justify-items: center; gap: 10px; text-decoration: none; color: var(--text); font-size: .86rem; font-weight: 600; text-align: center; line-height: 1.25; }
.app-tile-icon { width: 76px; height: 76px; border-radius: 20px; background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,.08)); display: flex; align-items: center; justify-content: center; font-size: 1.85rem; transition: transform .15s ease, box-shadow .15s ease; }
.app-tile:hover .app-tile-icon { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(0,0,0,.13); }
/* Teintes SCOPÉES au lanceur : .tone-blue/.tone-teal/.tone-green existent déjà
   ailleurs (badges/anneau de score des Évaluations) — sans le scope, ces règles
   plus tardives dans la cascade les recoloreraient (piège « dérive de palette »). */
.app-tile-icon.tone-blue { color: #0a5dc2; } .app-tile-icon.tone-teal { color: #0f8a80; } .app-tile-icon.tone-purple { color: #7048c9; }
.app-tile-icon.tone-orange { color: #d97706; } .app-tile-icon.tone-cyan { color: #0284c7; } .app-tile-icon.tone-green { color: #1a8a3c; }
.app-tile-icon.tone-indigo { color: #4f46e5; } .app-tile-icon.tone-amber { color: #b45309; } .app-tile-icon.tone-pink { color: #be185d; }
.app-tile-icon.tone-red { color: #cc3344; } .app-tile-icon.tone-slate { color: #55606e; }


.app-tile-icon svg { width: 30px; height: 30px; display: block; }
/* Bloc marque cliquable → retour à la grille (logo = point de chute) */


@media (max-width: 520px) {
  .apps-grid { grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 22px 14px; }
  .app-tile-icon { width: 64px; height: 64px; border-radius: 17px; font-size: 1.6rem; }
}

/* Panneau « Actions Direction » (cockpit) */
.direction-form { display: grid; gap: 10px; }
.direction-list { margin-top: 2px; }
.direction-list > .eyebrow { display: block; margin-bottom: 4px; }
.direction-list ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.direction-list li { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: .85rem; padding: 8px 11px; background: var(--surface-2); border: 1px solid var(--border); border-radius: 10px; }
.direction-list li .inline-form { margin: 0; }
.rh-client-avatar-lg { width: 54px; height: 54px; font-size: 1rem; }

/* Encarts regroupés */
.rh-context-box {
  display: grid; gap: 12px;
  padding: 18px;
  background: var(--surface-2);
  border-radius: var(--r-lg);
}
.rh-detail-head {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center;
  gap: 14px; padding-right: 40px; /* dégage la croix de fermeture (coin haut-droit) */
}
.rh-detail-identity { display: grid; gap: 4px; min-width: 0; }
.rh-detail-identity .eyebrow { margin: 0; }
.rh-detail-identity h3 { margin: 0; font-size: 1.15rem; letter-spacing: -.02em; line-height: 1.15; }
.rh-detail-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 3px; }
.rh-detail-tag {
  font-size: .72rem; font-weight: 650; padding: 3px 9px; border-radius: var(--r-full);
  background: var(--surface-3); color: var(--text-soft);
}
.rh-detail-tag.is-status { background: var(--accent-soft); color: var(--accent-dark); }
/* Fiche : formulaire d'édition repliable (consultation d'abord) */
.rh-edit-details {
  border: 1px solid var(--border); border-radius: var(--r-lg);
  background: var(--surface-2); overflow: hidden;
}
.rh-edit-summary {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 14px 18px; cursor: pointer; list-style: none;
  font-weight: 650; font-size: .95rem; letter-spacing: -.01em; color: var(--text);
  -webkit-user-select: none; user-select: none;
}
.rh-edit-summary::-webkit-details-marker { display: none; }
.rh-edit-summary:hover { background: var(--surface-3); }
.rh-edit-summary i { font-style: normal; font-size: 1.15rem; line-height: 1; color: var(--text-soft); transition: transform .18s ease; }
.rh-edit-details[open] > .rh-edit-summary { border-bottom: 1px solid var(--border); }
.rh-edit-details[open] > .rh-edit-summary i { transform: rotate(90deg); }
.rh-edit-details > .rh-technician-form { padding: 16px 18px; display: grid; gap: 14px; }
.rh-edit-trace-note { margin: 0; font-size: .74rem; color: var(--text-muted); font-style: italic; }
.rh-technician-photo-lg { flex: 0 0 auto; width: 56px; height: 56px; border-radius: 50%; object-fit: cover; background: var(--surface-2); }
.rh-technician-photo-lg.rh-technician-photo-missing { display: grid; place-items: center; text-align: center; font-size: .62rem; line-height: 1.2; border: 1px dashed var(--border); color: var(--text-muted); padding: 4px; }
.rh-section-headline { display: grid; gap: 1px; }
.rh-section-headline strong { font-size: .95rem; font-weight: 650; letter-spacing: -.01em; }
.rh-section-headline span { font-size: .9rem; color: var(--text-soft); }

/* ─────────────────────────────────────────────────────────────
   Pop-up fiche (technicien/client) — hiérarchie & lisibilité
   ───────────────────────────────────────────────────────────── */
/* Encarts un peu plus aérés et délimités */
.rh-context-box { padding: 20px; gap: 14px; border: 1px solid var(--border); }

/* Titres de section : plus présents, avec un repère de couleur en tête. Le
   sous-titre éventuel (« Fiable », « 2 fichier(s) »…) reste la valeur mise en avant. */
.rh-context-box > .eyebrow,
.rh-context-box > .rh-section-headline > .eyebrow {
  display: flex; align-items: center; gap: 8px;
  font-size: .74rem; letter-spacing: .05em; color: var(--text-soft);
}
.rh-context-box > .eyebrow::before,
.rh-context-box > .rh-section-headline > .eyebrow::before {
  content: ""; width: 4px; height: 13px; border-radius: 2px;
  background: var(--accent); flex: 0 0 auto;
}

/* Remarques RH : cartes colorées selon positif / point d'attention */
.rh-feedback-list { display: grid; gap: 8px; }
.rh-feedback-row {
  display: grid; gap: 3px; padding: 10px 12px 11px 13px;
  background: var(--surface); border-radius: var(--r-md);
  border-left: 3px solid var(--border-strong);
}
.rh-feedback-row.is-positive { border-left-color: #1f9d55; }
.rh-feedback-row.is-negative { border-left-color: #e5544b; }
.rh-feedback-row strong { font-size: .86rem; font-weight: 650; letter-spacing: -.01em; }
.rh-feedback-row span { font-size: .72rem; color: var(--text-muted); }
.rh-feedback-row p { margin: 0; font-size: .85rem; color: var(--text-soft); line-height: 1.35; }

/* Absences : petites cartes lisibles */
.rh-absence-list { display: grid; gap: 8px; }
.rh-absence-row {
  display: grid; gap: 2px; padding: 10px 12px;
  background: var(--surface); border-radius: var(--r-md);
}
.rh-absence-row strong { font-size: .86rem; font-weight: 650; letter-spacing: -.01em; }
.rh-absence-row span { font-size: .8rem; color: var(--text-soft); }
.rh-absence-row small { font-size: .74rem; color: var(--text-muted); }

/* Notation : étoiles + compteurs bien espacés */
.rh-rating-summary { display: grid; gap: 6px; }
.rh-rating-summary p { margin: 0; font-size: .8rem; color: var(--text-soft); }

/* Liens document nets sur fond gris (carte blanche bordée) */
.rh-context-box .rh-document-link { background: var(--surface); border-color: var(--border); }

/* Formulaire de dépôt */
/* ── Carnet de contacts de la fiche client (chantier / sécurité / autres) ── */
.client-contacts-box { display: grid; gap: 10px; }
.client-contact-list { display: grid; gap: 8px; }
.client-contact-row { border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); }
.client-contact-row > summary { display: flex; align-items: center; gap: 8px; padding: 9px 11px; cursor: pointer; list-style: none; flex-wrap: wrap; }
.client-contact-row > summary::-webkit-details-marker { display: none; }
.client-contact-row[open] > summary .client-contact-edit-hint { opacity: 1; }
.client-contact-type { flex: 0 0 auto; font-size: .64rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 2px 8px; border-radius: 999px; background: var(--surface-2); color: var(--text-soft); border: 1px solid var(--border); }
.client-contact-row.is-chantier .client-contact-type { color: var(--accent-text, #0a5dc2); border-color: rgba(0,113,227,.3); background: rgba(0,113,227,.08); }
.client-contact-row.is-securite .client-contact-type { color: var(--coral-text); border-color: rgba(255,59,48,.28); background: var(--coral-soft); }
.client-contact-row > summary strong { font-size: .84rem; }
.client-contact-quick { font-size: .74rem; color: var(--text-soft); min-width: 0; }
.client-contact-quick a { color: inherit; }
.client-contact-edit-hint { margin-left: auto; font-size: .8rem; color: var(--text-muted); opacity: .55; }
.client-contact-note { margin: 0; padding: 0 11px 4px; font-size: .74rem; font-style: italic; color: var(--text-soft); white-space: pre-wrap; }
.client-contact-form { display: grid; gap: 10px; padding: 10px 11px 12px; border-top: 1px dashed var(--border); }
.client-contact-add .client-contact-form { border-top: none; }
.client-contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px 10px; }
.client-contact-grid label { display: grid; gap: 4px; font-size: .72rem; font-weight: 650; color: var(--text-soft); }
.client-contact-grid input, .client-contact-grid select { font: inherit; font-size: .82rem; padding: 7px 9px; border: 1px solid var(--border); border-radius: var(--r-sm, 8px); background: var(--surface); color: var(--text); }
.client-contact-actions { display: flex; align-items: center; gap: 8px; }
.client-contact-delete { color: var(--coral-text); border-color: rgba(255,59,48,.28); }
.client-contact-delete:hover { background: var(--coral-soft); border-color: var(--coral); }
.client-contact-add > summary, .client-activity-add > summary { cursor: pointer; list-style: none; font-size: .8rem; font-weight: 650; color: var(--accent-text, #0a5dc2); padding: 4px 2px; }
.client-contact-add > summary::-webkit-details-marker, .client-activity-add > summary::-webkit-details-marker { display: none; }

/* Feedback hebdomadaire du commercial (SALES éditable + SMM lecture) */
.wf-progress { height: 6px; border-radius: 999px; background: var(--surface-2); overflow: hidden; margin: 4px 0 14px; }
.wf-progress > span { display: block; height: 100%; background: var(--accent, #0071e3); border-radius: 999px; transition: width var(--duration) var(--ease); }
.wf-list { display: grid; gap: 12px; }
.wf-card { border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); padding: 12px 14px; display: grid; gap: 10px; }
.wf-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.wf-card-head strong { display: block; font-size: .92rem; }
.wf-card-head small { color: var(--text-soft); font-size: .74rem; }
.wf-badge { flex: 0 0 auto; font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; padding: 3px 9px; border-radius: 999px; border: 1px solid var(--border); }
.wf-badge.is-yes { color: #1a7f37; background: rgba(26,127,55,.1); border-color: rgba(26,127,55,.3); }
.wf-badge.is-no { color: var(--coral-text); background: var(--coral-soft); border-color: rgba(255,59,48,.28); }
.wf-badge.is-todo { color: var(--text-soft); background: var(--surface-2); }
.wf-continue-label { display: grid; gap: 5px; font-size: .78rem; font-weight: 650; color: var(--text-soft); }
.wf-continue-label select { font: inherit; font-size: .86rem; padding: 8px 10px; border: 1px solid var(--border); border-radius: var(--r-sm, 8px); background: var(--surface); color: var(--text); }
.wf-block { display: grid; gap: 8px; padding: 10px; border-radius: var(--r-sm, 8px); background: var(--surface-2); }
.wf-block-yes { border-left: 3px solid rgba(26,127,55,.4); }
.wf-block-no { border-left: 3px solid var(--coral); }
.wf-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px 10px; }
.wf-block label, .wf-note-field { display: grid; gap: 4px; font-size: .74rem; font-weight: 650; color: var(--text-soft); }
.wf-block input, .wf-block textarea, .wf-note-field input { font: inherit; font-size: .84rem; padding: 7px 9px; border: 1px solid var(--border); border-radius: var(--r-sm, 8px); background: var(--surface); color: var(--text); resize: vertical; }
.wf-actions { margin-top: 14px; display: flex; justify-content: flex-end; align-items: center; gap: 14px; }
.wf-card-readonly { gap: 6px; }
.wf-answer { font-size: .82rem; }
.wf-answer p { margin: 2px 0; }
.wf-answer.is-todo { color: var(--text-soft); font-style: italic; }
.wf-tasks span, .wf-repl { color: var(--text-soft); }
.wf-note { margin: 4px 0 0; font-size: .76rem; color: var(--text-soft); font-style: italic; }
/* Feedback hebdo : liste dynamique des techniciens qui continuent */
.wf-hc-field { display: grid; gap: 4px; font-size: .74rem; font-weight: 650; color: var(--text-soft); }
.wf-hc-field input { max-width: 120px; }
.wf-tech-wrap { display: grid; gap: 6px; }
.wf-tech-label { font-size: .74rem; font-weight: 650; color: var(--text-soft); }
.wf-tech-label small { display: block; font-weight: 500; color: var(--text-muted, #98989d); font-size: .68rem; }
.wf-tech-list { display: grid; gap: 6px; }
.wf-tech-row { display: flex; align-items: center; gap: 8px; }
.wf-tech-num { flex: 0 0 auto; width: 18px; text-align: right; font-size: .74rem; color: var(--text-muted, #98989d); font-variant-numeric: tabular-nums; }
.wf-tech-row input { flex: 1 1 auto; font: inherit; font-size: .84rem; padding: 7px 9px; border: 1px solid var(--border); border-radius: var(--r-sm, 8px); background: var(--surface); color: var(--text); }
.wf-exception-field small { font-weight: 500; color: var(--text-muted, #98989d); }
.wf-tech-names { margin: 4px 0 2px; padding-left: 18px; display: grid; gap: 1px; font-size: .8rem; }
.wf-tech-names li { list-style: disc; }
.wf-exception span { color: var(--text-soft); }
.wf-exception { font-size: .78rem; }
/* Feedback hebdo : réaffectation des techniciens libérés (« Non ») */
.wf-reassign-wrap { display: grid; gap: 6px; }
.wf-reassign-list { display: grid; gap: 6px; }
.wf-reassign-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.wf-reassign-tech { flex: 0 0 auto; min-width: 120px; font-size: .82rem; font-weight: 650; }
.wf-reassign-arrow { flex: 0 0 auto; color: var(--text-muted, #98989d); }
.wf-reassign-row input { flex: 1 1 160px; font: inherit; font-size: .84rem; padding: 7px 9px; border: 1px solid var(--border); border-radius: var(--r-sm, 8px); background: var(--surface); color: var(--text); }
.wf-reassign-names { margin: 4px 0 2px; padding-left: 18px; display: grid; gap: 1px; font-size: .8rem; }
.wf-reassign-names li { list-style: disc; }
.wf-reassign-names span { color: var(--text-muted, #98989d); }
/* Feedback hebdo : client ajouté à la main + badge planning modifié */
.wf-badge.is-changed { color: #9a6700; background: rgba(255,193,7,.14); border-color: rgba(255,193,7,.4); }
/* Feedback hebdo : qui continue / qui ne continue pas (bloc « Oui ») */
.wf-continue-list { display: grid; gap: 8px; }
.wf-ct-row { display: grid; grid-template-columns: auto 1fr; gap: 6px 10px; align-items: center; padding: 6px 0; }
.wf-ct-toggle { display: inline-flex; align-items: center; gap: 5px; font-size: .72rem; font-weight: 650; color: var(--text-soft); white-space: nowrap; cursor: pointer; }
.wf-ct-toggle input { width: 16px; height: 16px; accent-color: #1a7f37; }
.wf-ct-name { font: inherit; font-size: .84rem; padding: 7px 9px; border: 1px solid var(--border); border-radius: var(--r-sm, 8px); background: var(--surface); color: var(--text); }
.wf-ct-row:has(input[data-wf-ct-continue]:not(:checked)) .wf-ct-name { opacity: .7; }
.wf-ct-leave { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(150px, 1fr) minmax(150px, 1fr); gap: 6px 10px; padding: 8px 10px; margin-top: 2px; border-radius: var(--r-sm, 8px); background: var(--coral-soft, rgba(255,59,48,.06)); border-left: 3px solid var(--coral, #ff3b30); }
.wf-ct-leave select, .wf-ct-leave input { font: inherit; font-size: .82rem; padding: 6px 8px; border: 1px solid var(--border); border-radius: var(--r-sm, 8px); background: var(--surface); color: var(--text); }
.wf-ct-reason-other { grid-column: 1 / -1; }
.wf-add-tech { align-self: start; justify-self: start; margin-top: 2px; font: inherit; font-size: .78rem; font-weight: 650; color: var(--accent-text, #0a5dc2); background: none; border: 1px dashed var(--border); border-radius: var(--r-sm, 8px); padding: 6px 10px; cursor: pointer; }
.wf-add-tech:hover { border-color: var(--accent, #0071e3); }
.wf-continue-count { margin: 2px 0 0; font-size: .78rem; color: var(--text-soft); }
.wf-continue-count strong { color: var(--text); }
/* Vue SMM : techniciens qui ne continuent pas */
.wf-departures { margin: 4px 0 2px; }
.wf-dep-title { margin: 0 0 2px; font-size: .78rem; font-weight: 650; color: var(--coral-text, #c4291c); }
.wf-dep-names { margin: 0; padding-left: 18px; display: grid; gap: 1px; font-size: .8rem; }
.wf-dep-names li { list-style: disc; }
.wf-dep-names span { color: var(--text-muted, #98989d); }
/* Icône métier à côté d'un nom de technicien (planning, pool, feedback) */
.trade-icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; vertical-align: -2px; margin-right: 5px; color: var(--text-soft, #6b7280); opacity: .9; }
.trade-icon svg { display: block; }
.pg-row-label .trade-icon { color: var(--accent-text, #0a5dc2); opacity: .85; }
.pg-row-link .trade-icon { margin-right: 4px; }
.wf-dep-names .trade-icon { color: var(--coral-text, #c4291c); }
.wf-client-name-input { font: inherit; font-size: .92rem; font-weight: 650; padding: 6px 8px; border: 1px solid var(--border); border-radius: var(--r-sm, 8px); background: var(--surface); color: var(--text); width: 100%; max-width: 320px; }
.wf-add-row { margin-top: 12px; }
.wf-add-client { font-size: .82rem; }
.wf-empty-hint { font-size: .82rem; color: var(--text-soft); margin: 0 0 10px; }

/* Priorités SMM→SALES : échéance initiale + éditeur SMM replié */
.sales-priority-original { font-size: .72rem; color: var(--text-muted); font-style: italic; }
.priority-edit-toggle { margin-top: 8px; }
.priority-edit-toggle .client-contact-form { border-top: 1px dashed var(--border); }

/* « Créer une activité » — fiche client + panneau CRM > Activités */
.client-activity-box { display: grid; gap: 8px; }
.crm-create-activity-panel .client-activity-add > summary { font-size: .9rem; font-weight: 700; }
.crm-create-activity-panel .client-contact-form { border-top: none; padding: 12px 0 0; }

.rh-client-document-form { display: grid; gap: 12px; }
.rh-client-document-form > label { display: grid; gap: 5px; font-size: .76rem; font-weight: 650; color: var(--text-soft); }
.rh-client-document-form input[type=text],
.rh-client-document-form select {
  padding: 10px 12px; border: 1.5px solid var(--border-strong, rgba(0,0,0,.12));
  border-radius: 12px; font: inherit; font-size: .9rem; font-weight: 500; background: var(--surface);
}
.rh-client-document-form input[type=text]:focus,
.rh-client-document-form select:focus { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }

.rh-client-dropzone {
  display: grid; gap: 4px; place-items: center; text-align: center;
  padding: 22px 16px;
  border: 1.5px dashed rgba(0,113,227,.4);
  border-radius: var(--r-lg);
  background: rgba(0,113,227,.04);
  cursor: pointer;
  transition: background .14s, border-color .14s;
}
.rh-client-dropzone:hover, .rh-client-dropzone.is-dragover { background: rgba(0,113,227,.09); border-color: var(--accent); }
.rh-client-dropzone strong { font-size: .9rem; font-weight: 650; color: var(--text); }
.rh-client-dropzone span { font-size: .78rem; color: var(--text-soft); }
.rh-client-dropzone input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

/* Colonnes de documents */
.rh-client-document-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); gap: 14px; }
.rh-client-document-group { display: grid; gap: 8px; align-content: start; }
.rh-document-list { display: grid; gap: 6px; }

/* Lien document (contrats, offres, bons signés) — était sans style */
.rh-document-link {
  display: grid; gap: 1px;
  padding: 9px 12px; border-radius: var(--r-sm);
  background: var(--surface-2); border: 1px solid transparent;
  text-decoration: none; color: var(--text);
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.rh-document-link:hover { background: var(--surface); border-color: var(--border); box-shadow: var(--shadow-sm); }
.rh-document-link > span { font-size: .68rem; text-transform: uppercase; letter-spacing: .05em; color: var(--text-soft); font-weight: 700; }
.rh-document-link > strong { font-size: .9rem; font-weight: 620; letter-spacing: -.01em; }
.rh-document-link > small { font-size: .78rem; color: var(--text-soft); }

/* ── Bons de commande signés : dossiers mensuels (fiche client) ── */
.rh-bons-section { margin-top: 6px; }
.rh-bon-folders { display: grid; gap: 8px; }
.rh-bon-folder {
  border: 1px solid var(--border); border-radius: var(--r-md);
  background: var(--surface); overflow: hidden;
}
.rh-bon-folder-head {
  display: flex; align-items: center; gap: 10px;
  padding: 11px 14px; cursor: pointer;
  list-style: none; -webkit-user-select: none; user-select: none;
  font-size: .9rem; color: var(--text);
  transition: background .15s ease;
}
.rh-bon-folder-head::-webkit-details-marker { display: none; }
.rh-bon-folder-head:hover { background: var(--surface-2); }
.rh-bon-folder[open] .rh-bon-folder-head { border-bottom: 1px solid var(--border); }
.rh-bon-folder-icon { display: inline-flex; color: var(--accent); }
.rh-bon-folder-icon svg { width: 20px; height: 20px; }
.rh-bon-folder-label { font-weight: 650; letter-spacing: -.01em; text-transform: capitalize; }
.rh-bon-folder-count {
  margin-left: auto; font-size: .76rem; font-weight: 650;
  color: var(--text-soft); background: var(--surface-2);
  padding: 2px 9px; border-radius: var(--r-full); white-space: nowrap;
}
.rh-bon-folder-chevron {
  color: var(--text-soft); font-size: 1.15rem; line-height: 1;
  transition: transform .18s ease; transform: rotate(0deg);
}
.rh-bon-folder[open] .rh-bon-folder-chevron { transform: rotate(90deg); }
.rh-bon-folder-body { padding: 10px 12px; }

@media (max-width: 560px) {
  .rh-modal { padding: 0; align-items: flex-end; }
  .rh-modal-card { width: 100%; max-height: 92vh; border-radius: 24px 24px 0 0; padding: 22px; }
}

/* ── Barre d'outils + tri clients (segmented control iOS) ── */
.rh-client-toolbar {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: var(--gap-md); flex-wrap: wrap; margin: var(--gap-md) 0;
}
.rh-search-field-inline { margin: 0; flex: 1 1 240px; }
.rh-sort-toggle {
  display: inline-flex; gap: 2px; padding: 3px;
  background: var(--surface-2); border-radius: var(--r-full);
}
.rh-sort-btn {
  border: 0; cursor: pointer;
  padding: 7px 16px; border-radius: var(--r-full);
  font: inherit; font-size: .8rem; font-weight: 600;
  color: var(--text-soft); background: transparent;
  transition: background .16s ease, color .16s ease, box-shadow .16s ease;
}
.rh-sort-btn:hover { color: var(--text); }
.rh-sort-btn.is-active {
  background: var(--surface); color: var(--text);
  box-shadow: 0 1px 3px rgba(0,0,0,.12);
}
@media (max-width: 480px) {
  .rh-client-toolbar { flex-direction: column; align-items: stretch; }
  .rh-sort-toggle { justify-content: center; }
}
.rh-contract-wizard {
  position: relative;
  padding: var(--gap-lg);
  background:
    radial-gradient(120% 80% at 50% -10%, rgba(0,113,227,.05), transparent 60%);
  border-radius: var(--r-lg);
}

/* Une étape = une « fiche question » */
.rh-contract-step { display: grid; gap: 18px; }
.rh-contract-step[hidden] { display: none; }
.rh-contract-step.is-active { animation: rhStepIn .5s cubic-bezier(.16,1,.3,1) both; }
@keyframes rhStepIn {
  0%   { opacity: 0; transform: translateX(60px); filter: blur(6px); }
  60%  { filter: blur(0); }
  100% { opacity: 1; transform: none; filter: blur(0); }
}

.rh-contract-step-head { display: grid; gap: 4px; text-align: center; max-width: 560px; margin: 0 auto; }
.rh-contract-step.is-active .rh-contract-step-head { animation: rhHeadIn .55s cubic-bezier(.16,1,.3,1) both; }
@keyframes rhHeadIn {
  from { opacity: 0; transform: translateY(-12px); }
  to   { opacity: 1; transform: none; }
}
.rh-contract-step-head .eyebrow { justify-self: center; }
.rh-contract-step-head h3 { font-size: 1.4rem; font-weight: 650; letter-spacing: -.02em; }
.rh-contract-step-head p { font-size: .9rem; color: var(--text-soft); line-height: 1.5; }

/* Grille de petites fiches-questions */
.rh-contract-choice-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
  max-width: 720px;
  margin: 0 auto;
}

/* La petite fiche cliquable */
.rh-contract-choice {
  display: grid;
  gap: 8px;
  padding: 18px 16px;
  text-align: left;
  font: inherit;
  cursor: pointer;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  transition: transform .18s cubic-bezier(.2,.7,.2,1), box-shadow .18s, border-color .18s;
}
.rh-contract-step.is-active .rh-contract-choice {
  animation: rhChoiceIn .52s cubic-bezier(.34,1.56,.64,1) both;
}
.rh-contract-step.is-active .rh-contract-choice:nth-child(1) { animation-delay: .10s; }
.rh-contract-step.is-active .rh-contract-choice:nth-child(2) { animation-delay: .17s; }
.rh-contract-step.is-active .rh-contract-choice:nth-child(3) { animation-delay: .24s; }
.rh-contract-step.is-active .rh-contract-choice:nth-child(4) { animation-delay: .31s; }
.rh-contract-step.is-active .rh-contract-choice:nth-child(5) { animation-delay: .38s; }
.rh-contract-step.is-active .rh-contract-choice:nth-child(6) { animation-delay: .45s; }
@keyframes rhChoiceIn {
  0%   { opacity: 0; transform: translateY(34px) scale(.85); }
  100% { opacity: 1; transform: none; }
}
/* La pastille d'icône « rebondit » à l'apparition */
.rh-contract-step.is-active .rh-contract-choice-icon {
  animation: rhIconPop .6s cubic-bezier(.34,1.56,.64,1) both;
  animation-delay: inherit;
}
@keyframes rhIconPop {
  0%   { transform: scale(0) rotate(-18deg); }
  60%  { transform: scale(1.18) rotate(4deg); }
  100% { transform: scale(1) rotate(0); }
}
.rh-contract-choice:hover {
  transform: translateY(-3px);
  border-color: rgba(0,113,227,.3);
  box-shadow: var(--shadow-md);
}
.rh-contract-choice:active { transform: translateY(-1px) scale(.99); }
.rh-contract-choice strong { font-size: .96rem; font-weight: 650; letter-spacing: -.01em; color: var(--text); }
.rh-contract-choice small { font-size: .78rem; color: var(--text-soft); line-height: 1.4; }

/* Pastille d'icône (les 3 lettres) */
.rh-contract-choice-icon {
  display: inline-grid; place-items: center;
  width: 40px; height: 40px;
  border-radius: 12px;
  font-size: .64rem; font-weight: 700; letter-spacing: .03em;
  color: var(--accent);
  background: linear-gradient(145deg, rgba(0,113,227,.12), rgba(0,113,227,.06));
}
/* Flèche d'invite au survol */
.rh-contract-choice::after {
  content: "→";
  position: absolute;
  opacity: 0;
}
.rh-contract-choice { position: relative; }
.rh-contract-choice:hover .rh-contract-choice-icon {
  color: #fff;
  background: linear-gradient(145deg, #0A84FF, var(--accent));
  box-shadow: 0 4px 12px rgba(0,113,227,.3);
}

/* Étape résultat */
.rh-contract-result-step .rh-document-list-wide {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap: 10px;
  max-width: 720px; margin: 0 auto;
}
.rh-contract-step-actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.rh-contract-back {
  display: inline-flex; align-items: center; gap: 6px;
  justify-self: center;
}
.rh-contract-back::before { content: "‹"; font-size: 1.1rem; line-height: 1; }

/* Fil d'Ariane discret au-dessus des choix (sur les sous-étapes) */
.rh-contract-step:not([data-rh-contract-step="root"]) .rh-contract-step-head::before {
  content: "Affiner la demande";
  display: inline-block;
  justify-self: center;
  font-size: .66rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: var(--accent);
  background: rgba(0,113,227,.08);
  padding: 4px 12px; border-radius: var(--r-full);
  margin-bottom: 4px;
}

/* Formulaire de dépôt rapide */
.rh-contract-upload-form {
  display: grid; gap: 14px;
  margin-top: 20px; padding: 20px;
  background: var(--surface-2);
  border-radius: var(--r-lg);
}
.rh-contract-upload-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap: 12px; }
.rh-contract-upload-fields label { display: grid; gap: 5px; font-size: .76rem; font-weight: 650; color: var(--text-soft); }
.rh-contract-upload-fields input,
.rh-contract-upload-fields select {
  padding: 10px 12px; border: 1.5px solid rgba(0,0,0,.12); border-radius: 12px;
  font: inherit; font-size: .9rem; font-weight: 500; background: var(--surface);
}
.rh-contract-upload-fields input:focus,
.rh-contract-upload-fields select:focus { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }
.rh-contract-dropzone {
  display: grid; gap: 4px; place-items: center; text-align: center;
  padding: 22px 16px; cursor: pointer;
  border: 1.5px dashed rgba(0,113,227,.4); border-radius: var(--r-lg);
  background: rgba(0,113,227,.04);
  transition: background .14s, border-color .14s;
}
.rh-contract-dropzone:hover, .rh-contract-dropzone.is-dragover { background: rgba(0,113,227,.09); border-color: var(--accent); }
.rh-contract-dropzone strong { font-size: .9rem; font-weight: 650; }
.rh-contract-dropzone span { font-size: .78rem; color: var(--text-soft); }
.rh-contract-dropzone input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

@media (prefers-reduced-motion: reduce) {
  .rh-contract-step.is-active,
  .rh-contract-step.is-active .rh-contract-choice { animation: none; }
}
@media (max-width: 560px) {
  .rh-contract-choice-grid { grid-template-columns: 1fr; }
}

/* ── Calendrier légal belge (réorganisation) ── */
.rh-calendar-panel { display: grid; gap: 14px; }
.rh-calendar-grid { gap: 4px; }
.rh-calendar-cell {
  min-height: 60px;
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 2px;
  border-radius: 10px;
  transition: border-color .14s, box-shadow .14s, transform .08s;
}
.rh-calendar-cell.has-reminders, .rh-calendar-cell[data-rh-calendar-day] { cursor: pointer; }
.rh-calendar-cell[data-rh-calendar-day]:hover { border-color: rgba(0,113,227,.35); box-shadow: var(--shadow-md); }
.rh-calendar-cell > strong { font-size: .8rem; font-weight: 700; color: var(--text); }
.rh-calendar-cell.is-today > strong {
  display: inline-grid; place-items: center;
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--accent); color: #fff; font-size: .72rem;
}
.rh-calendar-cell.is-today { border-color: var(--accent); box-shadow: none; }

/* Légende */
.rh-calendar-legend {
  display: flex; flex-wrap: wrap; gap: 16px;
  padding: 10px 2px 0;
  font-size: .74rem; color: var(--text-soft);
}
.rh-calendar-legend span { display: inline-flex; align-items: center; gap: 6px; }
.rh-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.rh-dot.is-today { background: var(--accent); }
.rh-dot.is-holiday { background: var(--gold); }
.rh-dot.is-reminder { background: var(--accent); opacity: .45; }

/* Deux colonnes : jours fériés + rappels */
.rh-calendar-lists {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px;
  padding-top: 6px; border-top: 1px solid var(--border);
}
.rh-calendar-list-block { display: grid; gap: 8px; align-content: start; }

/* Listes en fiches propres (plus de puces brutes) */
.rh-holiday-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.rh-holiday-list li {
  display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 12px;
  padding: 9px 12px;
  background: var(--surface-2);
  border-radius: 10px;
}
.rh-holiday-list li > strong {
  font-size: .72rem; font-weight: 700; letter-spacing: -.01em;
  color: var(--accent);
  background: var(--surface);
  border-radius: 7px; padding: 4px 9px; white-space: nowrap;
  text-align: center;
}
.rh-holiday-list li > span { font-size: .84rem; color: var(--text); font-weight: 500; }
.rh-holiday-list li.is-empty {
  grid-template-columns: 1fr; background: transparent;
  border: 1px dashed var(--border); justify-items: center; padding: 16px;
}
.rh-holiday-list li.is-empty span { color: var(--text-muted); font-size: .8rem; }

/* ── Navigation du mois (calendrier RH) ── */
.rh-calendar-nav { display: inline-flex; align-items: center; gap: 8px; flex-wrap: nowrap; }
.rh-cal-arrow {
  display: inline-grid; place-items: center;
  width: 34px; height: 34px; flex: none;
  border-radius: 50%;
  background: var(--surface-2); color: var(--text);
  font-size: 1.2rem; line-height: 1; text-decoration: none;
  transition: background .14s, color .14s;
}
.rh-cal-arrow:hover { background: var(--surface-3); color: var(--accent); }
.rh-month-form { display: inline-flex; align-items: center; gap: 6px; margin: 0; }
.rh-month-form input[type=month] {
  height: 34px; padding: 0 10px;
  border: 1.5px solid rgba(0,0,0,.12); border-radius: 10px;
  font: inherit; font-size: .85rem; font-weight: 500; background: var(--surface);
}
.rh-month-form input[type=month]:focus { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }
.rh-cal-go {
  height: 34px; padding: 0 14px;
  border: 0; border-radius: 10px; cursor: pointer;
  background: var(--accent); color: #fff;
  font: inherit; font-size: .82rem; font-weight: 600;
  transition: background .14s;
}
.rh-cal-go:hover { background: #0063C6; }
@media (max-width: 560px) {
  .rh-calendar-panel .panel-header { flex-direction: column; align-items: flex-start; gap: 10px; }
  .rh-calendar-nav { flex-wrap: wrap; }
}

/* ───────────────────────────────────────────────────────────
   Onglet RH · Recrutement
   ─────────────────────────────────────────────────────────── */
.rh-recruitment-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: var(--gap-md);
  align-items: start;
}
.rh-job-generator, .rh-applications-panel { padding: var(--gap-lg); min-width: 0; }

/* Formulaires en grille (champs courts sur 2 colonnes, zones de texte pleine largeur) */
.rh-job-form { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.rh-job-form > label {
  display: grid; gap: 5px;
  font-size: .76rem; font-weight: 650; color: var(--text-soft);
  min-width: 0;
}
.rh-job-form > label:has(textarea),
.rh-job-form > button { grid-column: 1 / -1; }
.rh-job-form input,
.rh-job-form select,
.rh-job-form textarea {
  width: 100%;
  padding: 10px 12px;
  border: 1.5px solid rgba(0,0,0,.12); border-radius: 12px;
  font: inherit; font-size: .88rem; font-weight: 500; background: var(--surface);
  box-sizing: border-box;
}
.rh-job-form textarea { resize: vertical; min-height: 70px; }
.rh-job-form input:focus,
.rh-job-form select:focus,
.rh-job-form textarea:focus { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }
.rh-job-form button { justify-self: start; }

/* Liste des candidatures */
.rh-application-list { display: grid; gap: 8px; margin-top: 14px; }
.rh-application-row {
  display: grid; gap: 2px;
  padding: 12px 14px;
  background: var(--surface-2);
  border-radius: 12px;
}
.rh-application-row strong { font-size: .9rem; font-weight: 650; }
.rh-application-row span { font-size: .8rem; color: var(--text-soft); }
.rh-application-row small { font-size: .74rem; color: var(--text-muted); }
.rh-application-row a {
  justify-self: start; margin-top: 4px;
  font-size: .76rem; font-weight: 600; color: var(--accent);
}

/* Bibliothèque d'offres générées */
.rh-offers-panel { padding: var(--gap-lg); margin-top: var(--gap-md); }
.rh-job-offer-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 12px;
  margin-top: var(--gap-sm);
}

@media (max-width: 720px) {
  .rh-job-form { grid-template-columns: 1fr; }
}

/* Carte d'offre générée (le <pre> doit se replier pour ne pas étirer la page) */
.rh-job-offer {
  display: grid; gap: 10px;
  padding: var(--gap-lg);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  min-width: 0;
}
.rh-job-offer pre {
  margin: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  font: inherit; font-size: .82rem; line-height: 1.5;
  color: var(--text-soft);
  max-height: 280px; overflow-y: auto;
  background: var(--surface-2);
  border-radius: 12px; padding: 12px 14px;
}

/* ═══════════════════════════════════════════════════════════
   HARMONISATION GLOBALE — Module RH « Apple-like »
   Animations d'entrée cohérentes + micro-interactions
   ═══════════════════════════════════════════════════════════ */

/* Entrée en fondu montant, réutilisable */
@keyframes rhFadeUp {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: none; }
}
@keyframes rhPanelIn {
  from { opacity: 0; transform: translateY(10px) scale(.995); }
  to   { opacity: 1; transform: none; }
}

/* Les grands panneaux de la page RH apparaissent en douceur */
.rh-page > .rh-command-panel { animation: rhPanelIn .4s var(--ease) both; }
.rh-page > .panel,
.rh-page > section { animation: rhPanelIn .45s var(--ease) both; animation-delay: .05s; }

/* KPIs : cascade */
.rh-stat-grid .rh-stat-card { animation: rhFadeUp .5s var(--ease) both; }
.rh-stat-grid .rh-stat-card:nth-child(1) { animation-delay: .04s; }
.rh-stat-grid .rh-stat-card:nth-child(2) { animation-delay: .09s; }
.rh-stat-grid .rh-stat-card:nth-child(3) { animation-delay: .14s; }
.rh-stat-grid .rh-stat-card:nth-child(4) { animation-delay: .19s; }
.rh-stat-grid .rh-stat-card:nth-child(5) { animation-delay: .24s; }
.rh-stat-grid .rh-stat-card:nth-child(6) { animation-delay: .29s; }
/* KPIs cliquables : légère élévation */
button.rh-stat-card { transition: border-color var(--duration), background var(--duration), box-shadow var(--duration), transform .14s var(--ease); }
button.rh-stat-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
button.rh-stat-card:active { transform: translateY(0) scale(.99); }

/* Cartes techniciens & clients : cascade d'entrée (plafonnée) */
.rh-technician-grid .rh-technician-card,
.rh-client-grid .rh-client-card { animation: rhFadeUp .5s var(--ease) both; }
.rh-technician-grid .rh-technician-card:nth-child(1),
.rh-client-grid .rh-client-card:nth-child(1) { animation-delay: .03s; }
.rh-technician-grid .rh-technician-card:nth-child(2),
.rh-client-grid .rh-client-card:nth-child(2) { animation-delay: .06s; }
.rh-technician-grid .rh-technician-card:nth-child(3),
.rh-client-grid .rh-client-card:nth-child(3) { animation-delay: .09s; }
.rh-technician-grid .rh-technician-card:nth-child(4),
.rh-client-grid .rh-client-card:nth-child(4) { animation-delay: .12s; }
.rh-technician-grid .rh-technician-card:nth-child(5),
.rh-client-grid .rh-client-card:nth-child(5) { animation-delay: .15s; }
.rh-technician-grid .rh-technician-card:nth-child(6),
.rh-client-grid .rh-client-card:nth-child(6) { animation-delay: .18s; }
.rh-technician-grid .rh-technician-card:nth-child(7),
.rh-client-grid .rh-client-card:nth-child(7) { animation-delay: .21s; }
.rh-technician-grid .rh-technician-card:nth-child(8),
.rh-client-grid .rh-client-card:nth-child(8) { animation-delay: .24s; }
/* Carte technicien : même langage d'élévation que les clients */
.rh-technician-card { transition: transform .18s var(--ease), box-shadow .18s, border-color .18s; }
.rh-technician-card:hover { transform: translateY(-3px); }
.rh-technician-card:active { transform: translateY(-1px) scale(.995); }
.rh-dashboard-row { transition: background .14s, transform .12s var(--ease); }
.rh-dashboard-row:hover { transform: translateX(2px); }

/* Cellule de calendrier : pop léger à l'apparition de la grille */
.rh-calendar-grid .rh-calendar-cell { animation: rhFadeUp .4s var(--ease) both; }

/* Champs d'édition de la fiche technicien (modale) — alignés sur le reste */
.rh-edit-field { display: grid; gap: 5px; font-size: .76rem; font-weight: 650; color: var(--text-soft); min-width: 0; }
.rh-edit-field input,
.rh-edit-field select,
.rh-edit-field textarea {
  width: 100%; box-sizing: border-box;
  padding: 10px 12px;
  border: 1.5px solid rgba(0,0,0,.12); border-radius: 12px;
  font: inherit; font-size: .88rem; font-weight: 500; background: var(--surface);
  transition: border-color .14s, box-shadow .14s;
}
.rh-edit-field textarea { resize: vertical; min-height: 64px; }
.rh-edit-field input:focus,
.rh-edit-field select:focus,
.rh-edit-field textarea:focus { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }

/* Champ incomplet nécessitant une action RH : cerclé en rouge (remplace
   l'ancien bloc « À compléter »). Le repère disparaît dès que le champ est
   renseigné et la fiche rechargée. */
.rh-edit-field.is-missing > span { color: #d64545; }
.rh-edit-field.is-missing input,
.rh-edit-field.is-missing select,
.rh-edit-field.is-missing textarea {
  border-color: #e5544b;
  box-shadow: 0 0 0 3px rgba(229,84,75,.14);
}
.rh-edit-field.is-missing input:focus,
.rh-edit-field.is-missing select:focus,
.rh-edit-field.is-missing textarea:focus {
  border-color: #e5544b;
  box-shadow: 0 0 0 3px rgba(229,84,75,.30);
}
/* Sous-champ conditionnel « Type de sous-traitant » : liseré discret pour
   signaler qu'il découle du « Type d'emploi » juste au-dessus (2026-08-04). */
.rh-subkind-field { border-left: 2px solid var(--accent-soft); padding-left: 9px; }

/* Champ dérivé, en lecture seule (ex. « Nom complet » recopié de Nom + Prénom) */
.rh-edit-field.is-auto > span::after {
  content: " · auto"; color: var(--text-muted); font-weight: 500;
}
.rh-edit-field.is-auto input[readonly] {
  background: var(--surface-2); color: var(--text); cursor: default;
}
.rh-edit-field.is-auto input[readonly]:focus {
  border-color: rgba(0,0,0,.12); box-shadow: none;
}

/* Coût : unité (€/h ou €/mois) en gris à côté du libellé */
.rh-cost-field em[data-rh-cost-unit] { font-style: normal; color: var(--text-muted); font-weight: 500; }

/* Contrat : bloc « Début » + case « date de fin » regroupés, pleine largeur */
.rh-contract-block { grid-column: 1 / -1; display: grid; gap: 10px; }
.rh-checkbox-field {
  display: flex; align-items: center; gap: 9px; cursor: pointer;
  font-size: .84rem; font-weight: 600; color: var(--text);
}
.rh-checkbox-field input[type="checkbox"] {
  width: 18px; height: 18px; flex: 0 0 auto; accent-color: var(--accent); cursor: pointer;
}
.rh-contract-end-date[hidden] { display: none; }
.rh-contract-end-date { max-width: 260px; }

/* Checklist conformité documents (auto-cochée selon les PDF déposés) */
.rh-doc-checklist {
  display: grid; gap: 8px; margin-top: 6px;
  padding: 16px; border: 1px solid var(--border); border-radius: var(--r-lg);
  background: var(--surface-2);
}
.rh-check-row {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px; border-radius: var(--r-md); background: var(--surface);
  font-size: .88rem;
}
.rh-check-mark {
  display: grid; place-items: center; flex: 0 0 auto;
  width: 22px; height: 22px; border-radius: var(--r-full);
  font-size: .82rem; font-weight: 700;
}
.rh-check-row.is-done .rh-check-mark { background: rgba(38,166,91,.15); color: #1f9d55; }
.rh-check-row.is-todo .rh-check-mark { background: var(--surface-2); color: var(--text-muted); }
.rh-check-label { font-weight: 600; color: var(--text); flex: 1 1 auto; min-width: 0; }
.rh-check-row.is-todo .rh-check-label { color: var(--text-soft); }
.rh-check-date { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
.rh-check-date > span { font-size: .72rem; font-weight: 600; color: var(--text-muted); }
.rh-check-date input[type="date"] {
  padding: 6px 9px; border: 1.5px solid rgba(0,0,0,.12); border-radius: 9px;
  font: inherit; font-size: .8rem; background: var(--surface);
}
.rh-check-date input[type="date"]:focus { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }
@media (max-width: 480px) {
  .rh-check-row { flex-wrap: wrap; }
  .rh-check-date { width: 100%; padding-left: 32px; }
}

/* Boutons : retour tactile homogène dans tout le module RH */
.rh-page .primary-button,
.rh-page .secondary-button,
.rh-page .ghost-button { transition: transform .12s var(--ease), background .14s, border-color .14s, box-shadow .14s; }
.rh-page .primary-button:active,
.rh-page .secondary-button:active,
.rh-page .ghost-button:active { transform: scale(.97); }

/* Respect de l'accessibilité : on coupe tout si l'utilisateur le demande */
@media (prefers-reduced-motion: reduce) {
  .rh-page * { animation: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   OPTIMISATION MOBILE — fluide, lisible et intuitif sur smartphone
   ═══════════════════════════════════════════════════════════════════ */

/* ── Tablette & mobile : la sidebar devient une barre supérieure compacte ── */
@media (max-width: 900px) {
  
  
  
        /* on garde le logo seul */
  
  
  .sales-side-link, .sales-side-toggle {
    width: auto;
    flex: 0 0 auto;
    white-space: nowrap;
    padding: 9px 13px;
    font-size: .82rem;
    min-height: 40px;
  }
  .sales-side-icon { display: none; }                 /* pills texte = plus compact */
  
          /* on garde le bouton déconnexion */

  
}

/* ── Mobile (≤ 768px) : densité, lisibilité, zones tactiles ── */
@media (max-width: 768px) {
  /* iOS : empêcher le zoom auto au focus d'un champ (police ≥ 16px) */
  input, select, textarea { font-size: 16px !important; }
  /* Zones tactiles confortables */
  button, .primary-button, .secondary-button, .ghost-button,
  .pg-nav-btn, .rh-sort-btn { min-height: 42px; }

  body { overflow-x: hidden; }

  /* Titres & panneaux resserrés */
  .rh-command-copy h2 { font-size: 1.3rem; }
  .rh-command-panel { padding: 16px 14px; border-radius: 18px; }
  .panel, .panel-wide { padding: 16px 14px; }
  .panel-header { flex-direction: column; align-items: flex-start; gap: 8px; }
  .rh-panel-actions { width: 100%; flex-wrap: wrap; }
  .rh-panel-actions .primary-button,
  .rh-panel-actions .ghost-button { flex: 1 1 auto; text-align: center; justify-content: center; }

  /* KPIs : 2 colonnes lisibles */
  .rh-stat-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .rh-stat-card strong { font-size: 1.4rem; }

  /* Espace techniciens : tout en une colonne */
  .rh-technician-workspace { grid-template-columns: 1fr; }
  .rh-technician-grid, .rh-client-grid { grid-template-columns: 1fr; }

  /* Calendrier : compact, sans texte dans les cases (repris dans les listes) */
  .rh-calendar-grid { gap: 2px; }
  .rh-calendar-cell { min-height: 42px; border-radius: 8px; padding: 3px; }
  .rh-calendar-cell > strong { font-size: .74rem; }
  .rh-calendar-cell.is-today > strong { width: 20px; height: 20px; }
  .rh-calendar-holiday,
  .rh-calendar-reminder-preview,
  .rh-calendar-reminder-more { display: none; }
  .rh-calendar-weekday { font-size: .56rem; }
  .rh-calendar-lists { grid-template-columns: 1fr; }
  .rh-calendar-nav { flex-wrap: nowrap; }

  /* Barre d'outils clients : recherche + tri empilés */
  .rh-client-toolbar { flex-direction: column; align-items: stretch; }
  .rh-sort-toggle { justify-content: stretch; }
  .rh-sort-btn { flex: 1; }

  /* ── Planning Gantt : scroll horizontal avec colonne figée ── */
  .pg-toolbar { flex-direction: column; align-items: stretch; gap: 8px; }
  .pg-nav { justify-content: space-between; }
  .pg-search-box { width: 100%; }
  .pg-search-box input { width: 100%; }
  .pg-legend { flex-wrap: wrap; gap: 8px 14px; }
  .pg-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .pg-grid { width: max-content; --pg-col: 36px; --pg-label: 120px; }
  
  

  /* Modales en feuille montante (bottom sheet) */
  .rh-modal { padding: 0; align-items: flex-end; }
  .rh-modal-card { width: 100%; max-width: 100%; max-height: 92vh; border-radius: 22px 22px 0 0; padding: 20px; }
  .pg-modal-overlay { align-items: flex-end; }
  .pg-modal { width: 100%; max-width: 100%; border-radius: 20px 20px 0 0; }

  /* Contenu de fiche : grilles internes adaptées au petit écran */
  .rh-client-document-columns,
  .rh-client-metrics { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

/* ── Petits écrans (≤ 430px) : derniers ajustements ── */
@media (max-width: 430px) {
  .rh-stat-grid { grid-template-columns: 1fr 1fr; gap: 6px; }
  .rh-stat-card { padding: 10px 12px; }
  .rh-recon-modal, .rh-recon-review { max-width: 100%; border-radius: 18px; }
  .rh-contract-step-head h3 { font-size: 1.15rem; }
  .pg-month { font-size: .9rem; }
}

/* ── CRM · Arborescence post-appel (issue de l'appel) ── */
.crm-call-outcome { margin-top: 4px; overflow: hidden; }
/* overflow:hidden indispensable : il rogne le glissement translateX de l'animation
   (sinon l'étape déborde à droite → scroll horizontal / largeur > 100%). */
.crm-call-wizard { padding: var(--gap-lg); border: 1px solid var(--border); border-radius: var(--r-xl); background: var(--surface); overflow: hidden; }
.crm-call-wizard .rh-contract-step { min-width: 0; }
.crm-call-wizard .rh-contract-step-head,
.crm-call-wizard .rh-contract-choice-grid,
.crm-call-wizard .crm-outcome-form { max-width: 100%; }
.crm-call-wizard .rh-contract-step-head::before { content: none !important; }
.crm-call-start { display: flex; justify-content: center; padding: 6px 0 2px; }
.crm-call-start-btn { padding: 13px 30px; font-size: .95rem; }
.crm-call-wizard .rh-contract-choice-grid { grid-template-columns: repeat(auto-fit, minmax(150px,1fr)); }
.crm-outcome-form { display: grid; gap: 12px; max-width: 620px; margin: 0 auto; text-align: left; }
.crm-outcome-form > label { display: grid; gap: 5px; font-size: .78rem; font-weight: 650; color: var(--text-soft); }
.crm-outcome-form input,
.crm-outcome-form select,
.crm-outcome-form textarea {
  width: 100%; box-sizing: border-box;
  padding: 10px 12px; border: 1.5px solid rgba(0,0,0,.12); border-radius: 12px;
  font: inherit; font-size: .9rem; font-weight: 500; background: var(--surface);
}
.crm-outcome-form input:focus,
.crm-outcome-form select:focus,
.crm-outcome-form textarea:focus { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }
.crm-outcome-form textarea { resize: vertical; }
.crm-outcome-form .crm-next-action-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.crm-outcome-form .crm-focus-guidance { margin: 0; font-size: .8rem; color: var(--accent); background: var(--accent-soft); padding: 8px 12px; border-radius: 10px; }
.crm-outcome-actions { display: flex; gap: 10px; justify-content: space-between; margin-top: 2px; }
.crm-outcome-actions .primary-button { flex: 1; }
@media (max-width: 560px) {
  .crm-outcome-form .crm-next-action-grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════════
   FILET DE SÉCURITÉ GLOBAL — durcissement anti « conteneur non stylé »
   (faible spécificité : toute règle de classe existante reste prioritaire)
   ═══════════════════════════════════════════════════════════════════ */

/* Conteneurs de formulaire orphelins → empilement régulier */
.proposal-form,
.crm-entity-form,
.crm-form-panel form,
.card-stack { display: grid; gap: var(--gap-sm); }

.rh-inline-form { display: flex; gap: var(--gap-sm); align-items: flex-end; flex-wrap: wrap; }
.rh-form-actions,
.form-actions { display: flex; gap: var(--gap-sm); flex-wrap: wrap; align-items: center; }
/* Statut de la sauvegarde automatique (fiche technicien, agenda…) */
.autosave-status { font-size: .8rem; font-weight: 600; color: var(--text-muted); transition: color .15s ease; }
.autosave-status[data-state="saving"] { color: var(--gold-text); }
.autosave-status[data-state="saved"] { color: var(--green-text); }
.autosave-status[data-state="saved"]::before { content: "✓ "; }
.autosave-status[data-state="error"] { color: var(--coral-text); }
.autosave-status[data-state="error"]::before { content: "⚠ "; }

/* Révélation progressive du login : mot de passe après l'adresse */
.login-step { display: grid; gap: 10px; }
.login-step[hidden] { display: none; }
.login-setup-note { margin: 0; font-size: .82rem; font-weight: 600; color: var(--green-text); line-height: 1.4; }

/* Cartes de rôle = indicateurs vivants (un seul champ identifiant) */
button.login-access-card { font: inherit; text-align: center; cursor: pointer; }
.login-access-card { transition: opacity .18s ease, filter .18s ease, border-color .18s ease; }
.login-access-card.is-dimmed { opacity: .32; filter: grayscale(1); }
.login-identity-block { display: grid; gap: 10px; }
.login-identifier-input { width: 100%; }

/* Connexion par e-mail professionnel + activation de compte */
.login-email-alt { width: 100%; margin-top: 14px; text-align: center; }
.login-email-alt summary { display: inline-block; font-size: .85rem; font-weight: 500; color: var(--text-soft); cursor: pointer; list-style: none; text-decoration: underline; text-underline-offset: 3px; }
.login-email-alt summary:hover { color: var(--accent); }
.login-email-alt summary::-webkit-details-marker { display: none; }
.login-email-form { display: grid; gap: 10px; padding: 14px 0 0; text-align: left; }
.login-email-form input { font: inherit; padding: 12px 14px; border-radius: var(--r-md); border: 1px solid var(--border-strong); background: var(--surface); color: var(--text); }
.login-email-form input::placeholder { color: var(--text-muted); }
.login-email-form input:focus { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }
.login-email-note { margin: 0; font-size: .76rem; color: var(--text-soft); line-height: 1.45; }

/* Onglet SMM Comptes & accès */
.account-table td { vertical-align: middle; }
.account-status { font-size: .78rem; font-weight: 700; }
.account-status.is-active { color: var(--green-text); }
.account-status.is-pending { color: var(--gold-text); }
.account-status.is-legacy { color: var(--text-muted); }
.account-pending { font-size: .72rem; color: var(--text-muted); }
.account-noemail { font-size: .8rem; color: var(--text-muted); }
.account-actions { text-align: right; }
.crm-field-wide { grid-column: 1 / -1; }
.section-inline-title { font-size: .95rem; font-weight: 650; letter-spacing: -.01em; }

/* Tout label qui enveloppe un champ texte/select : libellé au-dessus, espacé.
   Spécificité minime → écrasé par n'importe quelle règle dédiée existante. */
label:has(> input:not([type="checkbox"]):not([type="radio"])),
label:has(> select),
label:has(> textarea) {
  display: grid;
  gap: 5px;
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-soft);
}

/* Sur petit écran, les grilles de formulaire à 2 colonnes repassent à 1 */
@media (max-width: 560px) {
  .crm-next-action-grid,
  .crm-entity-form .crm-form-row,
  .sales-closeout-grid,
  .monthly-metrics-form-grid,
  .psse-form-grid,
  .psse-form-grid-large,
  .rh-edit-grid,
  .pointage-editor-grid,
  .pointage-entry-grid,
  .mission-form-grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════════
   MOBILE — garantie 100% de largeur (aucun débordement horizontal)
   ═══════════════════════════════════════════════════════════════════ */
@media (max-width: 820px) {
  /* Filet de sécurité : la page ne dépasse jamais la largeur de l'écran */
  html, body { max-width: 100%; overflow-x: hidden; }

  /* Toutes les grilles « contenu principal + colonne latérale » repassent
     en une seule colonne (sinon la colonne fixe ~320px provoque ~120% de large). */
  .hero-grid,
  .workspace-hero-grid,
  .workspace-main-grid,
  .workspace-page-hero,
  .split,
  .crm-page-layout,
  .crm-page-grid,
  .crm-activities-command-layout,
  .crm-home-main-grid,
  .crm-home-bottom-grid,
  .crm-home-support-grid,
  .mission-hero-grid,
  .mission-workspace,
  .workspace-balanced-grid,
  .crm-company-detail-grid,
  .crm-company-bottom-grid,
  .crm-report-split-grid,
  .crm-report-two-column,
  .pointage-hero-grid,
  .smm-hero-grid,
  .eval-layout { grid-template-columns: 1fr !important; }

  /* Les barres/stries en ligne s'enroulent au lieu de pousser la largeur */
  .crm-focus-stepbar,
  .sales-immersive-toolbar { flex-wrap: wrap; }
}

/* ── Tuiles filtres du pool clients (cliquables) ── */
.rh-stat-card-filter { cursor: pointer; transition: border-color var(--duration), background var(--duration), box-shadow var(--duration), transform .14s var(--ease); }
.rh-stat-card-filter:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: rgba(0,113,227,.3); }
.rh-stat-card-filter:active { transform: translateY(0) scale(.99); }
.rh-stat-card-filter.is-active { border-color: var(--accent); background: var(--accent-soft); }
.rh-stat-card-filter.is-active strong { color: var(--accent); }

/* ── Priorités confiées par le SMM (vue SALES) — bien visible ── */
.sales-priorities-panel {
  border: 1px solid rgba(255,159,10,.35);
  background: linear-gradient(180deg, var(--gold-soft), var(--surface) 60%);
  box-shadow: 0 2px 10px rgba(255,159,10,.10);
}
.panel-tag.is-alert { background: var(--gold-soft); color: var(--gold-text); border: 1px solid rgba(255,159,10,.3); }
.sales-priority-list { display: grid; gap: 10px; margin-top: 4px; }
.sales-priority-card {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  padding: 14px 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 4px solid var(--gold);
  border-radius: var(--r-lg);
}
.sales-priority-main { flex: 1 1 240px; min-width: 0; display: grid; gap: 3px; }
.sales-priority-main strong { font-size: .98rem; font-weight: 650; letter-spacing: -.01em; }
.sales-priority-main p { margin: 0; font-size: .84rem; color: var(--text-soft); }
.sales-priority-main small { font-size: .74rem; color: var(--text-muted); }
.sales-priority-period { color: var(--accent); font-weight: 600; }
.sales-priority-flag { font-size: .66rem; font-weight: 700; color: var(--gold-text); background: var(--gold-soft); border-radius: var(--r-full); padding: 2px 8px; vertical-align: middle; }
.sales-priority-controls { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sales-priority-done .primary-button { padding: 9px 14px; font-size: .82rem; white-space: nowrap; }
[data-priority-postpone-toggle] { padding: 9px 14px; font-size: .82rem; white-space: nowrap; transition: background .14s, color .14s; }
[data-priority-postpone-toggle].is-active { background: var(--gold-soft); color: var(--gold-text); }

/* Formulaire de report : masqué, révélé en douceur au clic sur « Reporter » */
.sales-priority-postpone,
.sales-priority-close {
  width: 100%;
  display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap;
  max-height: 0; opacity: 0; overflow: hidden;
  transform: translateY(-4px);
  transition: max-height .3s cubic-bezier(.2,.7,.2,1), opacity .25s ease,
              transform .3s cubic-bezier(.2,.7,.2,1), margin-top .3s ease;
}
.sales-priority-postpone.is-open,
.sales-priority-close.is-open {
  max-height: 240px; opacity: 1; transform: none; margin-top: 12px;
}
.sales-priority-postpone label,
.sales-priority-close label {
  display: grid; gap: 4px;
  font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--text-muted);
}
.sales-priority-postpone input[type="text"],
.sales-priority-close input[type="text"] { width: auto; min-width: 200px; padding: 9px 11px; font-size: .85rem; }
.sales-priority-postpone input[type="date"] { width: auto; min-width: 150px; padding: 9px 11px; font-size: .85rem; }
.sales-priority-postpone .primary-button,
.sales-priority-close .primary-button { padding: 9px 16px; font-size: .82rem; white-space: nowrap; }

.priority-postpone-note { margin: 6px 0 0; font-size: .76rem; color: var(--gold-text); }
.priority-task-card.is-overdue { border-left: 3px solid var(--coral); }
.channel-badge.warning { background: rgba(255,59,48,.12); color: var(--coral-text); }
.channel-badge.is-positive { background: rgba(52,199,89,.14); color: var(--green-text); }
@media (max-width: 640px) {
  .sales-priority-card { flex-direction: column; align-items: stretch; }
  .sales-priority-controls { justify-content: space-between; }
  .sales-priority-postpone input[type="text"],
  .sales-priority-postpone input[type="date"] { flex: 1; min-width: 0; }
  .sales-priority-postpone label,
  .sales-priority-close label { flex: 1 1 100%; }
}

/* ── Feuille de route hebdo : stepper léger lun→ven (même langage que le fil des missions) ── */
.sales-week-roadmap { display: grid; gap: 4px; }
.sales-week-roadmap .swr-week-label { font-size: .8rem; font-weight: 600; color: var(--text-soft); background: var(--surface-2); border-radius: var(--r-full); padding: 4px 12px; white-space: nowrap; }

.swr-track { position: relative; padding-top: 6px; }
.swr-line, .swr-fill { position: absolute; top: 27px; left: 10%; right: 10%; height: 4px; border-radius: var(--r-full); }
.swr-line { background: rgba(0,0,0,.08); }
.swr-fill { right: auto; width: 0; background: var(--accent); transition: width 300ms var(--ease); }

.swr-points { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: var(--gap-sm); align-items: start; }
.swr-day { position: relative; display: grid; justify-items: center; gap: 6px; min-width: 0; text-align: center; }
.swr-node { position: relative; display: grid; justify-items: center; gap: 6px; min-width: 0; outline: none; }
.swr-node:focus-visible .swr-marker { box-shadow: 0 0 0 4px var(--accent-soft); }

.swr-marker { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: #93BEF8; color: #fff; font-size: .9rem; font-weight: 700; font-variant-numeric: tabular-nums; transition: background .2s var(--ease), box-shadow .2s var(--ease); }
.swr-marker svg { display: block; }
.swr-day.is-done .swr-marker { background: var(--accent); }
.swr-day.is-today .swr-marker { background: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft), 0 4px 12px rgba(0,113,227,.3); }

.swr-day-label { display: grid; gap: 0; line-height: 1.15; }
.swr-day-label strong { font-size: .82rem; color: var(--text); }
.swr-day-label small { font-size: .68rem; color: var(--text-soft); font-variant-numeric: tabular-nums; }
.swr-day.is-today .swr-day-label strong { color: var(--accent); }
.swr-day.is-upcoming .swr-day-label strong, .swr-day.is-upcoming .swr-day-label small { opacity: .8; }

.swr-steps { display: grid; gap: 4px; width: 100%; margin-top: 2px; }
.swr-step { font-size: .74rem; font-weight: 550; line-height: 1.25; padding: 4px 9px; border-radius: var(--r-sm); background: var(--surface-2); color: var(--text-soft); overflow-wrap: anywhere; }
.swr-step-span { margin-left: 5px; font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; opacity: .7; }
.swr-step.is-planned { background: var(--accent-soft); color: var(--accent); }
.swr-step.is-active { background: var(--accent-soft); color: var(--accent); font-weight: 700; box-shadow: inset 0 0 0 1px rgba(0,113,227,.35); }
.swr-step.is-overdue { background: var(--coral-soft); color: var(--coral-text); }
.swr-step.is-done { background: var(--green-soft); color: var(--green-text); text-decoration: line-through; opacity: .85; }
.swr-step.is-more { background: transparent; color: var(--text-muted); font-weight: 700; }
.swr-step.is-continuation { opacity: .72; font-weight: 500; }  /* jour(s) suivant(s) d'une priorité étalée */

.swr-undated { margin: 10px 0 0; font-size: .78rem; color: var(--gold-text); }

/* Fenêtre au survol : contenu complet du jour survolé */
.swr-day-pop {
  position: absolute; top: calc(100% + 12px); left: 50%; margin-left: -120px; width: 240px;
  z-index: 30; text-align: left;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg);
  box-shadow: 0 12px 30px rgba(0,0,0,.14); padding: 12px 14px;
  opacity: 0; visibility: hidden; transform: translateY(-4px); pointer-events: none;
  transition: opacity .16s var(--ease), transform .16s var(--ease), visibility .16s;
}
.swr-day-pop::before {
  content: ""; position: absolute; top: -6px; left: 120px; margin-left: -6px;
  width: 12px; height: 12px; background: var(--surface);
  border-left: 1px solid var(--border); border-top: 1px solid var(--border); transform: rotate(45deg);
}
.swr-day:first-child .swr-day-pop { left: 0; margin-left: 0; }
.swr-day:last-child .swr-day-pop { left: auto; right: 0; margin-left: 0; }
.swr-day:first-child .swr-day-pop::before, .swr-day:last-child .swr-day-pop::before { display: none; }

.swr-pop-head { margin: 0 0 8px; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--text-soft); }
.swr-pop-list { display: grid; gap: 10px; }
.swr-pop-item { display: grid; grid-template-columns: 9px 1fr; gap: 9px; align-items: start; }
.swr-pop-dot { width: 9px; height: 9px; border-radius: 50%; margin-top: 5px; background: var(--accent); }
.swr-pop-item.is-overdue .swr-pop-dot { background: var(--coral); }
.swr-pop-item.is-done .swr-pop-dot { background: var(--green); }
.swr-pop-item.is-planned .swr-pop-dot { background: #93BEF8; }
.swr-pop-copy strong { font-size: .84rem; font-weight: 650; color: var(--text); }
.swr-pop-span { font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; color: var(--text-soft); }
.swr-pop-detail { margin: 3px 0 0; font-size: .78rem; color: var(--text-soft); line-height: 1.3; }
.swr-pop-status { display: inline-block; margin-top: 4px; font-size: .68rem; font-style: normal; font-weight: 700; color: var(--text-muted); }
.swr-pop-item.is-overdue .swr-pop-status { color: var(--coral-text); }
.swr-pop-item.is-done .swr-pop-status { color: var(--green-text); }
.swr-pop-item.is-active .swr-pop-status { color: var(--accent); }
.swr-pop-empty { margin: 0; font-size: .82rem; color: var(--text-soft); }

@media (hover: hover) and (pointer: fine) {
  .swr-day:hover .swr-day-pop, .swr-day:focus-within .swr-day-pop {
    opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto;
  }
  .swr-day:hover, .swr-day:focus-within { z-index: 40; }
  .swr-day:hover .swr-steps, .swr-day:focus-within .swr-steps { visibility: hidden; }
}

@media (max-width: 720px) {
  .swr-line, .swr-fill { top: 23px; }
  .swr-marker { width: 34px; height: 34px; font-size: .8rem; }
  .swr-step { font-size: .68rem; padding: 3px 7px; }
  .swr-step-span { display: none; }
  .swr-day-label small { display: none; }
  .swr-day-pop { display: none; }
}

/* ── Intervenants cliquables dans le panneau Missions (RH) ── */
.rh-mission-col-techs { min-width: 0; }
.rh-mission-techs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.rh-mission-tech {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 5px 10px;
  background: var(--accent-soft);
  color: var(--accent);
  border: 1px solid rgba(0,113,227,.2);
  border-radius: var(--r-full);
  font-size: .8rem; font-weight: 600;
  text-decoration: none;
  transition: background .14s, border-color .14s, transform .12s var(--ease);
}
.rh-mission-tech:hover { background: rgba(0,113,227,.16); border-color: var(--accent); transform: translateY(-1px); }
.rh-mission-tech-go { font-weight: 700; }
.rh-mission-tech.is-empty {
  background: var(--surface-2); color: var(--text-muted);
  border: 1px dashed var(--border); cursor: default;
}

/* ── Carte mission (bloc « Suivi / Toutes les missions ») — padding & corps ── */
.mission-list-card { padding-bottom: var(--gap-md); }
.mission-list-card header { padding-bottom: var(--gap-xs); }
.mission-list-card header h4 { font-size: .95rem; font-weight: 650; letter-spacing: -.01em; }
.mission-card-head-actions { margin-left: auto; flex-shrink: 0; }
/* Corps : aligner sur le padding horizontal de l'en-tête */
.mission-list-card > p,
.mission-list-card > .mission-card-progress,
.mission-list-card > .mission-card-actions { padding-left: var(--gap-lg); padding-right: var(--gap-lg); }
.mission-list-card > p { margin: 1px 0; font-size: .82rem; color: var(--text-soft); line-height: 1.4; }
.mission-list-card > p strong { color: var(--text); font-weight: 650; }

.mission-card-progress { display: flex; align-items: center; gap: var(--gap-sm); margin-top: var(--gap-sm); }
.mission-card-progress span { font-size: .74rem; font-weight: 600; color: var(--text-soft); white-space: nowrap; }
.progress-track { flex: 1; height: 6px; background: var(--surface-2); border-radius: var(--r-full); overflow: hidden; }
/* Scopé à .progress-track : ne PAS toucher .mission-step-fill (qui est aussi .progress-fill) */
.progress-track > .progress-fill { height: 100%; border-radius: var(--r-full); background: var(--accent); transition: width .3s var(--ease); }
.progress-track > .progress-fill.teal { background: var(--teal); }

.mission-card-actions { display: flex; gap: var(--gap-sm); flex-wrap: wrap; margin-top: var(--gap-md); }
.mission-card-actions .secondary-button { flex: 1; text-align: center; justify-content: center; min-width: 110px; }

/* ── File à traiter (SALES) — liste épurée des sociétés à appeler, 2 colonnes ── */
.crm-call-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
.crm-call-card {
  position: relative;
  display: grid; gap: 2px;
  padding: 14px 100px 14px 16px;   /* place à droite pour le CTA */
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  text-decoration: none;
  transition: border-color .14s, box-shadow .14s, transform .12s var(--ease);
}
.crm-call-card:hover { border-color: rgba(0,113,227,.3); box-shadow: var(--shadow-md); transform: translateY(-1px); }
.crm-call-cat {
  justify-self: start;
  font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
  padding: 2px 8px; border-radius: var(--r-full); margin-bottom: 2px;
}
.crm-call-cat-new { background: rgba(255,59,48,.10); color: var(--coral-text); }
.crm-call-cat-follow { background: var(--gold-soft); color: var(--gold-text); }
.crm-call-cat-opp { background: rgba(52,199,89,.14); color: var(--green-text); }
.crm-call-name { font-size: .95rem; font-weight: 650; letter-spacing: -.01em; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-call-sub { font-size: .8rem; color: var(--text-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-call-cta {
  position: absolute; top: 50%; right: 14px; transform: translateY(-50%);
  display: inline-flex; align-items: center; gap: 4px;
  padding: 8px 14px; border-radius: var(--r-full);
  background: var(--accent); color: #fff;
  font-size: .8rem; font-weight: 600; white-space: nowrap;
  transition: background .14s;
}
.crm-call-cta i { font-style: normal; font-weight: 700; }
.crm-call-card:hover .crm-call-cta { background: #0063C6; }
@media (max-width: 720px) {
  .crm-call-grid { grid-template-columns: 1fr; }
}

/* Assistant flottant (bulle bas-droite, disponible partout) */
.assistant-widget { position: fixed; right: 22px; bottom: 22px; z-index: 900; display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.assistant-fab { width: 56px; height: 56px; border-radius: 50%; border: 0; cursor: pointer; background: var(--accent); color: #fff; box-shadow: 0 10px 30px rgba(0,113,227,.4); display: grid; place-items: center; transition: transform .18s ease, box-shadow .18s ease; }
.assistant-fab:hover { transform: translateY(-2px) scale(1.04); box-shadow: 0 14px 36px rgba(0,113,227,.46); }
.assistant-fab-icon { font-size: 1.5rem; line-height: 1; }
.assistant-widget.is-open .assistant-fab { transform: scale(.9); opacity: .85; }
.assistant-panel { width: min(360px, calc(100vw - 32px)); max-height: min(560px, calc(100vh - 110px)); background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-xl); box-shadow: 0 24px 64px rgba(0,0,0,.22); display: flex; flex-direction: column; overflow: hidden; animation: assistantRise .22s var(--ease, ease); }
@keyframes assistantRise { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
.assistant-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 16px; background: linear-gradient(135deg, var(--accent-soft), var(--surface)); border-bottom: 1px solid var(--border); }
.assistant-head-titles { display: flex; align-items: center; gap: 10px; min-width: 0; }
.assistant-orb { flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--accent); color: #fff; font-size: 1rem; box-shadow: 0 6px 16px rgba(0,113,227,.3); }
.assistant-head-titles strong { display: block; font-size: .88rem; }
.assistant-head-titles span { font-size: .68rem; color: var(--text-muted); }
.assistant-close { border: 0; background: none; font-size: 1.4rem; line-height: 1; color: var(--text-muted); cursor: pointer; padding: 0 4px; }
.assistant-close:hover { color: var(--text); }
.assistant-answer { margin: 14px 16px 0; padding: 12px 14px; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--r-md); overflow-y: auto; }
.assistant-answer-text { margin: 0; font-size: .88rem; font-weight: 600; }
.assistant-answer-text.is-loading { color: var(--text-muted); font-weight: 500; }
.assistant-answer-list { margin: 8px 0 0; padding-left: 18px; display: grid; gap: 3px; }
.assistant-answer-list li { font-size: .82rem; color: var(--text-soft); font-weight: 400; }
.assistant-suggestions { display: flex; flex-wrap: wrap; gap: 7px; padding: 14px 16px 6px; }
.assistant-suggest { padding: 6px 12px; border: 1px solid var(--border); border-radius: var(--r-full); background: var(--surface); font-size: .74rem; font-weight: 600; color: var(--text-soft); cursor: pointer; transition: border-color .15s ease, color .15s ease, background .15s ease; }
.assistant-suggest:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.assistant-form { display: flex; gap: 8px; padding: 10px 16px 16px; margin-top: auto; }
.assistant-form input { flex: 1 1 auto; min-width: 0; padding: 11px 14px; border: 1px solid var(--border); border-radius: var(--r-full); background: var(--surface-2); font-size: .9rem; }
.assistant-form input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.assistant-send { flex: 0 0 auto; width: 42px; border: 0; border-radius: 50%; background: var(--accent); color: #fff; font-size: 1.15rem; cursor: pointer; }
.assistant-send:disabled { opacity: .5; }
@media (max-width: 560px) {
  .assistant-widget { right: 14px; bottom: 14px; }
  .assistant-fab { width: 50px; height: 50px; }
}

/* ===== Compte technicien — login terrain + pointage ===== */
.terrain-body { display: block; }
.terrain-center { max-width: 420px; }
.terrain-logo { height: 48px; width: auto; max-width: 210px; margin: 0 auto 14px; display: block; }
.terrain-subtitle { text-align: center; color: var(--text-soft); margin: 0 0 18px; }
.terrain-login-form { display: grid; gap: 14px; }
.terrain-login-back, .terrain-login-link { display: block; text-align: center; margin-top: 18px; color: var(--text-soft); font-size: .85rem; text-decoration: none; }
.terrain-login-back:hover, .terrain-login-link:hover { color: var(--accent); }

.terrain-lang-globe { display: block; text-align: center; font-size: 2.4rem; margin-bottom: 6px; }
.terrain-lang-title { font-size: clamp(1.5rem, 4vw, 2rem); margin-bottom: var(--gap-md); }
.terrain-lang-subtitle { font-size: .8rem; }
.terrain-lang-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.terrain-lang-form { margin: 0; }
.terrain-lang-btn { width: 100%; padding: 18px 14px; border-radius: var(--r-lg); border: 1px solid var(--border); background: var(--surface); font-size: 1.05rem; font-weight: 700; color: var(--text); cursor: pointer; }
.terrain-lang-btn:hover { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }

.terrain-webauthn-btn { width: 100%; padding: 16px; border-radius: var(--r-md); border: 1px solid var(--accent); background: var(--accent-soft); color: var(--accent); font-weight: 700; font-size: 1rem; cursor: pointer; margin-top: 8px; }
.terrain-webauthn-btn:hover { background: var(--accent); color: #fff; }
.terrain-or { text-align: center; font-size: .78rem; color: var(--text-muted); margin: 14px 0; }
.terrain-pin-form { display: grid; gap: 10px; }
.terrain-pin-input { width: 100%; padding: 16px; border-radius: var(--r-md); border: 1px solid var(--border); font-size: 1.4rem; text-align: center; letter-spacing: .3em; }
.terrain-pin-submit { width: 100%; padding: 14px; }
.terrain-security-prompt { background: var(--accent-soft); border-color: rgba(0,113,227,.3); }
.terrain-push-prompt { background: var(--teal-soft); border-color: rgba(50,173,230,.35); }
.terrain-push-prompt .terrain-photo-btn { background: var(--teal); }
.terrain-pin-setup-form { display: grid; gap: 8px; margin-top: 4px; }
.terrain-pin-setup-form input { padding: 12px 14px; border-radius: var(--r-md); border: 1px solid var(--border); font-size: 1rem; }

.terrain-app { max-width: 480px; margin: 0 auto; padding: 24px 18px 40px; display: grid; gap: 18px; }
.terrain-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.terrain-header h1 { font-size: 1.5rem; letter-spacing: -.02em; margin: 2px 0 0; }
.terrain-month-hours { margin: 6px 0 0; font-size: .82rem; font-weight: 600; color: var(--text-soft); }
.terrain-month-hours span { font-weight: 500; color: var(--text-muted); }
.terrain-logout { border: 1px solid var(--border); background: var(--surface); border-radius: var(--r-full); padding: 8px 16px; font-weight: 600; font-size: .85rem; cursor: pointer; color: var(--text-soft); }
.terrain-flash { padding: 12px 16px; border-radius: var(--r-md); background: rgba(52,199,89,.14); color: var(--green-text); font-weight: 600; font-size: .9rem; }
.terrain-offline-banner { padding: 12px 16px; border-radius: var(--r-md); background: rgba(142,142,147,.16); border: 1px solid rgba(142,142,147,.4); color: var(--text-muted); font-weight: 600; font-size: .85rem; line-height: 1.35; }
.terrain-offline-banner::before { content: "📴 "; }

/* Oubli de pointage : correction d'heure (validée par le SMM) */
.terrain-correct { border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--surface); }
.terrain-correct summary { padding: 14px 16px; font-weight: 600; font-size: .9rem; cursor: pointer; list-style: none; }
.terrain-correct summary::-webkit-details-marker { display: none; }
.terrain-correct[open] summary { border-bottom: 1px solid var(--border); }
.terrain-correct-form { display: grid; gap: 12px; padding: 14px 16px; }
.terrain-correct-form label { display: grid; gap: 5px; font-size: .82rem; font-weight: 600; }
.terrain-correct-form select, .terrain-correct-form input, .terrain-correct-form textarea {
  font: inherit; font-weight: 400; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); color: var(--text);
}
.terrain-correct-when { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.terrain-correct-note { margin: 0; font-size: .78rem; color: var(--gold-text); font-weight: 600; }
.terrain-correct-list { list-style: none; margin: 0; padding: 10px 16px 14px; display: grid; gap: 6px; }
.terrain-correct-item { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: .8rem; }
.terrain-correct-item em { font-style: normal; font-weight: 700; font-size: .74rem; }
.terrain-correct-item.is-pending em { color: var(--gold-text); }
.terrain-correct-item.is-approved em { color: var(--green-text); }
.terrain-correct-item.is-rejected em { color: var(--coral-text); }
.terrain-photo-prompt { padding: 18px 20px; border-radius: var(--r-lg); background: rgba(255,159,10,.1); border: 1px solid rgba(255,159,10,.35); display: grid; gap: 10px; }
.terrain-photo-prompt strong { display: block; font-size: 1.05rem; }
.terrain-photo-form { margin: 0; }
/* !important nécessaire : une règle globale button/label plus générique
   l'emporte sinon sur cette classe — ce bouton est une action, pas un libellé de champ. */
.terrain-photo-btn { display: inline-flex; align-items: center; justify-content: center; padding: 12px 20px; border: 0; border-radius: var(--r-md); background: var(--accent); color: #fff !important; font-weight: 700; cursor: pointer; }

/* Prise de photo caméra (getUserMedia) : fonctionne pareil sur ordinateur et mobile */
.terrain-camera-box { display: grid; gap: 14px; width: min(420px, 92vw); text-align: center; }
.terrain-camera-box video, .terrain-camera-box img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: var(--r-lg); background: #111; }
.terrain-camera-box video { transform: scaleX(-1); }
.terrain-camera-hint { margin: 0; font-size: .9rem; color: var(--text-soft); }
.terrain-camera-actions { display: flex; gap: 10px; }
.terrain-client-card { padding: 18px 20px; border-radius: var(--r-lg); background: var(--surface); border: 1px solid var(--border); }
.terrain-client-card strong { display: block; font-size: 1.3rem; letter-spacing: -.02em; margin-top: 4px; }
.terrain-client-none { color: var(--text-muted); font-size: 1.05rem; font-weight: 600; }
.terrain-punches { display: grid; gap: 14px; }
.terrain-punch-form { margin: 0; }
.terrain-punch { display: flex; align-items: center; gap: 16px; width: 100%; padding: 22px 22px; border-radius: var(--r-lg); border: 1px solid var(--border); background: var(--surface); text-align: left; }
.terrain-punch-btn { cursor: pointer; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.terrain-punch-btn:hover { border-color: var(--accent); box-shadow: 0 8px 24px rgba(0,0,0,.08); transform: translateY(-1px); }
.terrain-punch-btn:active { transform: translateY(0); }
.terrain-punch-icon { flex: 0 0 auto; width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; font-size: 1.4rem; background: var(--accent-soft); color: var(--accent); }
.terrain-punch div strong { display: block; font-size: 1.15rem; }
.terrain-punch div span { font-size: .85rem; color: var(--text-muted); }
.terrain-punch.is-done { background: rgba(52,199,89,.1); border-color: rgba(52,199,89,.3); }
.terrain-punch.is-done .terrain-punch-icon { background: var(--green); color: #fff; }
.terrain-punch .terrain-punch-eyebrow { display: block; font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--accent); margin-bottom: 2px; }
.terrain-punch-evening .terrain-punch-eyebrow { color: var(--gold-text); }
.terrain-punch-evening .terrain-punch-icon { background: var(--gold-soft); color: var(--gold-text); }
/* Pause de midi (piste 3) : présélections au pointage de départ */
.terrain-break { margin-top: 12px; padding: 16px; border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--surface); }
.terrain-break-q { margin: 0 0 12px; font-weight: 700; font-size: 1rem; text-align: center; }
.terrain-break-chips { display: grid; grid-template-columns: repeat(auto-fit, minmax(84px, 1fr)); gap: 10px; }
.terrain-break-chip { padding: 14px 10px; border-radius: var(--r-md); border: 1.5px solid var(--border); background: var(--surface-2); color: var(--text); font: inherit; font-weight: 700; font-size: 1rem; cursor: pointer; transition: border-color .12s, background .12s, transform .08s; }
.terrain-break-chip:hover { border-color: var(--accent); }
.terrain-break-chip:active { transform: scale(.96); }
.terrain-break-other-btn { background: transparent; color: var(--text-muted); font-weight: 600; }
.terrain-break-custom { display: flex; gap: 10px; margin-top: 10px; }
.terrain-break-custom input { flex: 1; min-width: 0; padding: 14px 12px; border: 1.5px solid var(--border); border-radius: var(--r-md); font: inherit; font-size: 1rem; background: var(--surface); color: var(--text); }
.tcheck-break { text-align: center; color: var(--text-muted); white-space: nowrap; }
.tcheck-net { white-space: nowrap; }
/* Pointage hors-ligne : bandeau de confirmation + bouton en attente d'envoi */
.terrain-offline-banner { padding: 12px 16px; border-radius: var(--r-md); background: var(--gold-soft); color: var(--gold-text); font-weight: 600; font-size: .9rem; margin-bottom: 14px; opacity: 0; transform: translateY(-4px); transition: opacity .25s ease, transform .25s ease; }
.terrain-offline-banner.is-visible { opacity: 1; transform: translateY(0); }
.terrain-punch--queued { opacity: .6; cursor: default; }
.terrain-punch--queued .terrain-punch-icon { background: rgba(245,158,11,.18); color: var(--gold-text); }
.terrain-punch.is-done .terrain-punch-eyebrow { color: var(--green-text); }
.terrain-help { font-size: .82rem; color: var(--text-soft); text-align: center; margin: 8px 0 0; line-height: 1.5; }

/* Signaler un problème depuis le chantier */
.terrain-report-card { display: grid; gap: 10px; }
.terrain-report-toggle { padding: 14px 18px; border-radius: var(--r-lg); border: 1px dashed var(--border-strong); background: var(--surface); color: var(--text-soft); font-weight: 700; font-size: .92rem; text-align: center; cursor: pointer; }
.terrain-report-toggle:hover { background: var(--surface-2); }
.terrain-report-form { display: grid; gap: 10px; padding: 16px 18px; border-radius: var(--r-lg); border: 1px solid var(--border); background: var(--surface); }
.terrain-report-form select { padding: 12px 14px; border-radius: var(--r-md); border: 1px solid var(--border); font-size: .95rem; background: var(--surface); }
.terrain-report-form textarea { padding: 12px 14px; border-radius: var(--r-md); border: 1px solid var(--border); font-size: .95rem; resize: vertical; font-family: inherit; }
.terrain-report-actions { display: flex; gap: 10px; }
.terrain-report-step1 { display: grid; gap: 10px; padding: 16px 18px; border-radius: var(--r-lg); border: 1px solid var(--border); background: var(--surface); }
.terrain-report-categories { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.terrain-report-cat-btn { padding: 16px 14px; border-radius: var(--r-md); border: 1px solid var(--border); background: var(--surface-2); font-size: .95rem; font-weight: 700; color: var(--text); cursor: pointer; text-align: center; }
.terrain-report-cat-btn:hover { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
.terrain-report-selected-cat { margin: 0; font-size: .8rem; font-weight: 700; color: var(--accent); text-transform: uppercase; letter-spacing: .04em; }
.terrain-report-selected-cat:empty { display: none; }

/* Sélecteur de nom (login terrain) — liste tactile fiable sur mobile */
.terrain-login-form [data-terrain-search] { width: 100%; padding: 14px 16px; font-size: 1.05rem; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); }
.terrain-login-form [data-terrain-search]:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.terrain-name-list { list-style: none; margin: 0; padding: 6px; max-height: 52vh; overflow-y: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--surface); display: grid; gap: 4px; }
.terrain-name-list li { margin: 0; }
.terrain-name-option { width: 100%; text-align: left; padding: 15px 16px; border: 0; background: var(--surface); border-radius: var(--r-md); font-size: 1.05rem; font-weight: 600; color: var(--text); cursor: pointer; }
.terrain-name-option:hover, .terrain-name-option:active, .terrain-name-option.is-selected { background: var(--accent-soft); color: var(--accent); }
.terrain-name-empty { padding: 18px; text-align: center; color: var(--text-muted); font-size: .9rem; }

/* Bons de commande du technicien (accepter / refuser / signer) */
.terrain-bons { display: grid; gap: 12px; }
.terrain-bons > .eyebrow { margin: 0; }
.terrain-bon { padding: 16px 18px; border-radius: var(--r-lg); border: 1px solid var(--border); background: var(--surface); display: grid; gap: 12px; }
.terrain-bon-head strong { display: block; font-size: 1.1rem; letter-spacing: -.01em; }
.terrain-bon-head span { display: block; font-size: .85rem; color: var(--text-soft); margin-top: 2px; }
.terrain-bon-head small { display: block; font-size: .72rem; color: var(--text-muted); margin-top: 3px; }
.terrain-bon-actions { display: flex; gap: 10px; }
.terrain-bon-btn { flex: 1 1 auto; padding: 13px 16px; border: 0; border-radius: var(--r-md); font-size: .95rem; font-weight: 700; cursor: pointer; }
.terrain-bon-btn.is-accept { background: var(--accent); color: #fff; }
.terrain-bon-btn.is-refuse { background: var(--coral-soft); color: var(--coral); }
.terrain-bon-btn.is-ghost { background: var(--surface-2); color: var(--text-soft); flex: 0 0 auto; }
.terrain-sign-hint { font-size: .82rem; color: var(--text-soft); margin: 0 0 8px; }
.terrain-sign-pad { width: 100%; height: 150px; border: 1.5px dashed var(--accent); border-radius: var(--r-md); background: var(--surface-2); touch-action: none; display: block; cursor: crosshair; }
.terrain-sign-actions { display: flex; gap: 10px; align-items: stretch; margin-top: 10px; }
.terrain-sign-actions form { flex: 1 1 auto; display: flex; }
.terrain-sign-actions form .terrain-bon-btn { width: 100%; }
.terrain-refuse-form { display: flex; flex-direction: column; gap: 8px; }
.terrain-refuse-form input { padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--r-md); font-size: .95rem; }
.terrain-bon-status { font-weight: 700; font-size: .9rem; }
.terrain-bon-status.is-ok { color: var(--green-text); }
.terrain-bon-status.is-no { color: var(--coral); }
.terrain-bon.is-accepted { background: rgba(52,199,89,.08); border-color: rgba(52,199,89,.3); }
.terrain-bon.is-refused { background: var(--coral-soft); border-color: rgba(255,59,48,.25); }

/* SMM — onglet pointages techniciens */
.tcheck-sort { margin-bottom: var(--gap-md); }
.tcheck-table { width: 100%; border-collapse: collapse; font-size: .86rem; }
.tcheck-table th { text-align: left; font-size: .64rem; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); padding: 8px 10px; border-bottom: 1px solid var(--border); }
.tcheck-table td { padding: 10px 10px; border-bottom: 1px solid var(--border); }
.tcheck-table .tcheck-tech { font-weight: 600; }
.tcheck-table .tcheck-time { font-variant-numeric: tabular-nums; }
.tcheck-pin { text-decoration: none; font-size: .8rem; opacity: .7; }
.tcheck-pin:hover { opacity: 1; }
.tcheck-corrected { color: var(--gold-text); font-size: .8rem; cursor: help; }

/* Pointages sans chantier : bandeau + attribution manuelle (filet fin de mois). */
.tcheck-orphan-note {
  margin: 10px 0 0; padding: 9px 12px; border-radius: var(--r-md);
  background: color-mix(in srgb, var(--warning, #d98a00) 12%, var(--surface));
  border-left: 3px solid var(--warning, #d98a00);
  font-size: .8rem; color: var(--text-soft);
}
.tcheck-row-orphan { background: color-mix(in srgb, var(--warning, #d98a00) 6%, transparent); }
.tcheck-attach-form { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.tcheck-orphan-tag {
  flex: 0 0 auto; font-size: .62rem; font-weight: 700; white-space: nowrap;
  padding: 1px 6px; border-radius: 999px; color: var(--warning, #d98a00);
  background: color-mix(in srgb, var(--warning, #d98a00) 16%, var(--surface));
}
.tcheck-attach-input {
  flex: 1 1 140px; min-width: 120px; padding: 5px 8px; font-size: .8rem;
  border: 1px solid var(--border); border-radius: var(--r-sm, 8px); background: var(--surface);
}
.tcheck-attach-input:focus { outline: 2px solid var(--accent); outline-offset: -1px; }
.tcheck-attach-btn {
  flex: 0 0 auto; width: 28px; height: 28px; border: none; border-radius: var(--r-sm, 8px);
  background: var(--accent); color: #fff; font-weight: 700; cursor: pointer; line-height: 1;
}
.tcheck-attach-btn:hover { filter: brightness(1.05); }

/* Corrections de pointage à valider (SMM) */
.correction-panel { border-left: 3px solid var(--gold); }
.correction-list { display: grid; gap: 10px; }
.correction-card { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--gold-soft); }
.correction-main { display: grid; gap: 3px; }
.correction-main span { font-size: .85rem; }
.correction-main s { color: var(--text-muted); }
.correction-main b { color: var(--gold-text); }
.correction-reason { margin: 2px 0 0; font-size: .82rem; font-style: italic; color: var(--text-muted); }
.correction-actions { display: flex; gap: 8px; }
.rent-table .rent-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rent-table .rent-num em { color: var(--text-muted); font-style: normal; font-size: .78em; }
.rent-table .rent-name a { color: inherit; text-decoration: none; font-weight: 600; }
.rent-table .rent-name a:hover { text-decoration: underline; }
.rent-table tr.is-unset td { color: var(--text-muted); }

/* Rentabilité v2 : blocs par technicien, lignes par client */
.rent-month-nav { display: flex; align-items: center; gap: 8px; }
.rent-tech-list { display: grid; gap: 10px; }
.rent-tech { border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); }
.rent-tech summary { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 14px; cursor: pointer; list-style: none; }
.rent-tech summary::-webkit-details-marker { display: none; }
.rent-tech[open] summary { border-bottom: 1px solid var(--border); }
.rent-tech-name { font-weight: 700; }
.rent-tech-name a { color: inherit; text-decoration: none; }
.rent-tech-name a:hover { text-decoration: underline; }
.rent-tech-name small { font-weight: 400; color: var(--text-muted); margin-left: 6px; }
.rent-tech-nums { font-size: .84rem; font-variant-numeric: tabular-nums; }
.rent-tech-nums .is-pos { color: var(--green-text); }
.rent-tech-nums .is-neg { color: var(--coral-text); }
.rent-line.is-pending td { background: var(--gold-soft); }
.rent-flag { font-size: .74rem; font-weight: 700; color: var(--gold-text); }
.rent-missing { font-size: .8rem; font-weight: 600; color: var(--gold-text); }
.rent-poste-form { display: flex; gap: 6px; align-items: center; }
.rent-poste-form select { font: inherit; font-size: .82rem; padding: 5px 8px; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface); }

/* Grille tarifaire clients */
.rate-table .rent-name { font-weight: 600; }
.rate-table em { color: var(--text-muted); font-style: normal; }
.rate-remove-cell { text-align: right; }
.rate-remove { padding: 2px 9px; font-size: .85rem; }
.rate-add-form { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border); }
.rate-add-form label { display: grid; gap: 5px; font-size: .8rem; font-weight: 600; }
.rate-add-form input, .rate-add-form select { font: inherit; font-weight: 400; padding: 9px 11px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); min-width: 170px; }
@media (max-width: 560px) {
  .terrain-punch { padding: 18px 16px; }
}

/* ── Cockpit manager SMM (refonte ERP équipes) ─────────────────────────── */
.smm-cockpit-hero { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 18px 20px; }
.smm-cockpit-head h2 { margin: 2px 0 0; font-size: 1.5rem; letter-spacing: -.02em; }
.smm-cockpit-date { margin: 2px 0 0; font-size: .82rem; color: var(--text-muted); text-transform: capitalize; }
.smm-vitals { display: grid; grid-template-columns: repeat(8, 1fr); gap: 10px; margin-top: 16px; }
@media (max-width: 1000px) { .smm-vitals { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 520px) { .smm-vitals { grid-template-columns: repeat(2, 1fr); } }
.smm-vital { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 12px 8px; border-radius: var(--r-md); background: var(--surface-2); border: 1px solid var(--border); text-align: center; }
.smm-vital-icon { font-size: 1.05rem; line-height: 1; }
.smm-vital-value { font-size: 1.5rem; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; color: var(--text); }
.smm-vital-label { font-size: .64rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--text-muted); }
.smm-vital.is-ok .smm-vital-value { color: var(--green-text); }
.smm-vital.is-alert { background: var(--gold-soft); border-color: rgba(245,158,11,.35); }
.smm-vital.is-alert .smm-vital-value { color: var(--gold-text); }

/* Centre d'action — liste consolidée priorisée */
.smm-action-center .panel-tag.is-alert { background: var(--coral-soft); color: var(--coral-text); }
.smm-action-list { display: flex; flex-direction: column; gap: 8px; }
.smm-action-item { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: var(--r-md); border: 1px solid var(--border); background: var(--surface); text-decoration: none; border-left: 4px solid var(--border-strong); transition: background .12s, transform .08s; }
.smm-action-item:hover { background: var(--surface-2); transform: translateX(2px); }
.smm-action-item.is-high { border-left-color: var(--coral); }
.smm-action-item.is-medium { border-left-color: var(--gold); }
.smm-action-icon { font-size: 1.15rem; flex: 0 0 auto; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--surface-2); }
.smm-action-body { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0; }
.smm-action-title { font-size: .88rem; font-weight: 700; color: var(--text); }
.smm-action-detail { font-size: .76rem; color: var(--text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.smm-action-meta { font-size: .64rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--text-soft); flex: 0 0 auto; }
.smm-action-go { color: var(--text-muted); font-weight: 700; flex: 0 0 auto; }
.smm-action-center.is-clear { background: rgba(22,163,74,.06); border-color: rgba(22,163,74,.22); }
.smm-action-clear { display: flex; align-items: center; gap: 14px; padding: 6px; }
.smm-action-clear-icon { font-size: 1.6rem; }

/* Suivi du commercial — zone n°1 (suivre/évaluer/piloter/conseiller/orienter) */
.smm-sales-supervision { display: flex; flex-direction: column; gap: var(--gap-lg); }
.smm-sales-intro { background: var(--sidebar); color: #fff; border-radius: var(--r-lg); padding: 20px 22px; }
.smm-sales-intro .eyebrow { color: rgba(255,255,255,.6); }
.smm-sales-intro h2 { margin: 2px 0 0; font-size: 1.5rem; letter-spacing: -.02em; }
.smm-sales-lead { margin: 6px 0 0; font-size: .9rem; color: rgba(255,255,255,.75); }
.smm-sales-nav { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.smm-sales-nav a { font-size: .78rem; font-weight: 700; color: #fff; background: rgba(255,255,255,.12); padding: 6px 12px; border-radius: var(--r-full); text-decoration: none; transition: background .12s; }
.smm-sales-nav a:hover { background: rgba(255,255,255,.24); }
.smm-verb-block { display: flex; flex-direction: column; gap: var(--gap-md); scroll-margin-top: 16px; }
.smm-verb-head { display: flex; align-items: baseline; gap: 12px; padding-bottom: 4px; border-bottom: 2px solid var(--border); }
.smm-verb-tag { flex: 0 0 auto; font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--accent); background: var(--accent-soft); padding: 5px 11px; border-radius: var(--r-full); }
.smm-verb-head h3 { margin: 0; font-size: 1.12rem; }
.smm-verb-head .page-note { margin: 2px 0 0; }
.smm-verb-head > div { display: flex; flex-direction: column; }

/* Zone commerciale repliable */
.smm-commercial { border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--surface); overflow: hidden; }
.smm-commercial-summary { cursor: pointer; list-style: none; padding: 16px 20px; display: flex; flex-direction: column; gap: 2px; user-select: none; }
.smm-commercial-summary::-webkit-details-marker { display: none; }
.smm-commercial-summary::after { content: "▾ déplier"; position: absolute; right: 20px; font-size: .74rem; color: var(--text-muted); font-weight: 600; }
.smm-commercial[open] .smm-commercial-summary::after { content: "▴ replier"; }
.smm-commercial-summary { position: relative; }
.smm-commercial-summary:hover { background: var(--surface-2); }
.smm-commercial-summary-title { font-size: 1.05rem; font-weight: 700; color: var(--text); }
.smm-commercial-summary-note { font-size: .76rem; color: var(--text-muted); }
.smm-commercial-body { padding: 4px 16px 16px; display: flex; flex-direction: column; gap: var(--gap-md); border-top: 1px solid var(--border); }

/* Boucle de présence — tableau du jour (contrôle terrain) */
.presence-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--gap-md); }
@media (max-width: 900px) { .presence-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .presence-grid { grid-template-columns: 1fr; } }
.presence-col { border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); overflow: hidden; }
.presence-col-head { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--border); background: var(--surface-2); }
.presence-col-icon { font-size: 1rem; }
.presence-col-title { font-size: .8rem; font-weight: 700; color: var(--text); flex: 1; }
.presence-col-count { font-size: .8rem; font-weight: 700; min-width: 26px; height: 22px; padding: 0 7px; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; background: var(--surface-3); color: var(--text-soft); }
.presence-col--ok .presence-col-count { background: var(--green-soft); color: var(--green-text); }
.presence-col--alert .presence-col-head { background: var(--gold-soft); }
.presence-col--alert .presence-col-count { background: var(--gold-soft); color: var(--gold-text); }
.presence-col--absent .presence-col-count { background: rgba(92,107,192,.14); color: #5C6BC0; }
.presence-list { list-style: none; margin: 0; padding: 6px 0; max-height: 260px; overflow-y: auto; }
.presence-person { display: flex; flex-direction: column; gap: 1px; padding: 7px 12px; border-bottom: 1px solid var(--border); }
.presence-person:last-child { border-bottom: none; }
.presence-name { font-size: .82rem; font-weight: 600; color: var(--text); }
.presence-detail { font-size: .72rem; color: var(--text-muted); }
.presence-meta { font-size: .7rem; color: var(--text-soft); font-variant-numeric: tabular-nums; }
.presence-empty { padding: 14px 12px; font-size: .76rem; color: var(--text-muted); font-style: italic; }
.presence-col--alert .presence-name { color: var(--gold-text); }

/* RH recrutement — adresse mail dédiée */
.rh-dedicated-mail { margin: 0 0 var(--gap-sm); padding: 9px 12px; background: var(--accent-soft); border-radius: var(--r-md); font-size: .8rem; color: var(--text-soft); }
.rh-dedicated-mail a { color: var(--accent); font-weight: 700; text-decoration: none; }
.rh-dedicated-mail a:hover { text-decoration: underline; }

/* RH recrutement — connexion boîte mail */
.rh-mail-config { background: linear-gradient(135deg, var(--accent-soft), var(--surface) 65%); border: 1px solid rgba(0,113,227,.18); margin-bottom: var(--gap-lg); }
.rh-mail-badge { flex: 0 0 auto; font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 5px 12px; border-radius: var(--r-full); }
.rh-mail-badge.is-ok { background: rgba(52,199,89,.14); color: var(--green-text); }
.rh-mail-badge.is-todo { background: var(--gold-soft); color: var(--gold-text); }
.rh-mail-form { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; margin-top: var(--gap-sm); }
.rh-mail-form label { display: flex; flex-direction: column; gap: 5px; font-size: .78rem; font-weight: 700; color: var(--text-soft); flex: 1 1 300px; }
.rh-mail-form input { padding: 11px 14px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); font-size: .95rem; font-weight: 400; letter-spacing: .04em; }
.rh-mail-form input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.rh-mail-help { margin-top: var(--gap-sm) !important; font-size: .73rem; }

/* ── Agenda partagé SMM ↔ SALES : vue mois cliquable ── */
.agenda-page { display: block; }
.agenda-layout { display: grid; grid-template-columns: minmax(0,1fr) 320px; gap: var(--gap-lg); align-items: start; }
.agenda-header { align-items: center; }
.agenda-nav { display: flex; align-items: center; gap: 6px; }
.agenda-nav .icon-button { min-width: 38px; font-size: 1.2rem; line-height: 1; }
.agenda-hint { margin: 0 0 var(--gap-sm); }

.agenda-grid { display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap: 6px; }
.agenda-weekhead { text-align: center; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-soft); padding-bottom: 2px; }
.agenda-weekhead.is-weekend { color: var(--text-muted); }

.agenda-cell { min-height: 92px; display: flex; flex-direction: column; gap: 4px; padding: 6px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); cursor: pointer; transition: border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease), background var(--duration) var(--ease); }
.agenda-cell:hover { border-color: var(--accent); box-shadow: var(--shadow-sm); }
.agenda-cell:focus-visible { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.agenda-cell.is-out { background: var(--surface-2); }
.agenda-cell.is-out .agenda-daynum { color: var(--text-muted); opacity: .6; }
.agenda-cell.is-weekend:not(.is-out) { background: color-mix(in srgb, var(--surface-2) 55%, var(--surface)); }
.agenda-cell.is-today { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.agenda-daynum { font-size: .82rem; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.agenda-cell.is-today .agenda-daynum { color: #fff; background: var(--accent); border-radius: 999px; width: 22px; height: 22px; display: grid; place-items: center; }
.agenda-cell-appts { display: grid; gap: 3px; align-content: start; }

.agenda-chip { display: flex; align-items: center; gap: 5px; width: 100%; text-align: left; border: 0; border-left: 3px solid var(--accent); border-radius: 5px; padding: 3px 6px; background: var(--accent-soft); color: var(--text); font-size: .72rem; line-height: 1.2; cursor: pointer; overflow: hidden; }
.agenda-chip:hover { filter: brightness(.97); }
.agenda-chip-time { font-weight: 700; font-variant-numeric: tabular-nums; flex-shrink: 0; }
.agenda-chip-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.agenda-chip.aud-common { border-left-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
.agenda-chip.aud-sales { border-left-color: var(--green); background: var(--green-soft); color: var(--green-text); }
.agenda-chip.aud-smm { border-left-color: var(--gold); background: var(--gold-soft); color: var(--gold-text); }

.agenda-legend { display: flex; gap: var(--gap-md); flex-wrap: wrap; margin-top: var(--gap-md); font-size: .78rem; color: var(--text-soft); }
.agenda-legend span { display: inline-flex; align-items: center; gap: 6px; }
.agenda-dot { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.agenda-dot.aud-common { background: var(--accent); }
.agenda-dot.aud-sales { background: var(--green); }
.agenda-dot.aud-smm { background: var(--gold); }

.agenda-form-panel { position: sticky; top: var(--gap-lg); }
.agenda-form { display: grid; gap: 10px; margin-top: 4px; }
.agenda-form label { display: grid; gap: 4px; font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; color: var(--text-muted); }
.agenda-form input, .agenda-form select, .agenda-form textarea { width: 100%; padding: 9px 11px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); font: inherit; font-weight: 400; text-transform: none; letter-spacing: normal; color: var(--text); }
.agenda-form input:focus, .agenda-form select:focus, .agenda-form textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.agenda-form textarea { resize: vertical; }
.agenda-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.agenda-form-actions { display: flex; align-items: center; gap: 8px; margin-top: 2px; }
.agenda-delete-form { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
.agenda-delete-form[hidden] { display: none; }
.agenda-delete-btn { color: var(--coral-text); border-color: rgba(255,59,48,.28); width: 100%; }
.agenda-delete-btn:hover { background: var(--coral-soft); border-color: var(--coral); }

@media (max-width: 960px) {
  .agenda-layout { grid-template-columns: 1fr; }
  .agenda-form-panel { position: static; }
}
@media (max-width: 620px) {
  .agenda-cell { min-height: 68px; }
  .agenda-chip-title { font-size: .68rem; }
}

/* ── SMM : réclamation des heures + bandeau facturation ── */
.presence-head-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.presence-reclaim-form { margin: 0; }
.presence-reclaim-btn { white-space: nowrap; color: var(--gold-text); border-color: rgba(255,159,10,.35); }
.presence-reclaim-btn:hover { background: var(--gold-soft); border-color: var(--gold); }

.smm-billing-band .smm-billing-chips { display: flex; flex-wrap: wrap; gap: var(--gap-sm); margin-top: 4px; }
.smm-billing-chip { display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 96px; flex: 1 1 96px; padding: 12px 10px; border-radius: var(--r-md); background: var(--surface-2); border: 1px solid var(--border); border-top: 3px solid var(--text-muted); }
.smm-billing-count { font-size: 1.4rem; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.smm-billing-label { font-size: .74rem; font-weight: 600; color: var(--text-soft); text-align: center; }
.smm-billing-chip.status-odoo_facture { border-top-color: var(--green); background: var(--green-soft); }
.smm-billing-chip.status-odoo_facture .smm-billing-count { color: var(--green-text); }
.smm-billing-chip.status-odoo_encode { border-top-color: var(--accent); background: var(--accent-soft); }
.smm-billing-chip.status-odoo_encode .smm-billing-count { color: var(--accent); }
.smm-billing-chip.status-odoo_recu { border-top-color: var(--text-soft); }
.smm-billing-chip.status-odoo_pas_recu { border-top-color: var(--gold); background: var(--gold-soft); }
.smm-billing-chip.status-odoo_pas_recu .smm-billing-count { color: var(--gold-text); }
.smm-billing-chip.status-odoo_probleme, .smm-billing-chip.status-odoo_refuse { border-top-color: var(--coral); background: var(--coral-soft); }
.smm-billing-chip.status-odoo_probleme .smm-billing-count, .smm-billing-chip.status-odoo_refuse .smm-billing-count { color: var(--coral-text); }

/* ── Offres commerciales : onglet SALES ── */
.crm-offers-workspace { display: grid; grid-template-columns: minmax(0,1fr) 300px; gap: var(--gap-lg); align-items: start; }
.offer-list { display: grid; gap: 6px; }
.offer-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); text-decoration: none; color: inherit; transition: border-color var(--duration) var(--ease); }
.offer-row:hover { border-color: var(--accent); }
.offer-row.is-active { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.offer-row-main { display: grid; gap: 1px; min-width: 0; }
.offer-row-main strong { font-size: .9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.offer-row-ref { font-size: .72rem; color: var(--text-soft); }
.offer-status { font-size: .7rem; font-weight: 700; padding: 2px 8px; border-radius: 999px; white-space: nowrap; background: var(--surface-3); color: var(--text-soft); }

.offer-form { display: grid; gap: 12px; margin-top: 4px; }
.offer-form label { display: grid; gap: 4px; font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; color: var(--text-muted); }
.offer-form input, .offer-form select, .offer-form textarea { width: 100%; padding: 9px 11px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); font: inherit; font-weight: 400; text-transform: none; letter-spacing: normal; color: var(--text); }
.offer-form textarea { resize: vertical; line-height: 1.4; }
.offer-form input:focus, .offer-form select:focus, .offer-form textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.offer-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.offer-form-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
/* Formulaire de suppression : SÉPARÉ du formulaire d'enregistrement (les
   formulaires HTML imbriqués sont ignorés par le navigateur → le bouton ne
   faisait rien). Espacé sous les actions d'enregistrement. */
.offer-delete-form { margin: 12px 0 0; padding-top: 12px; border-top: 1px solid var(--border); }
.offer-delete-btn { color: var(--coral-text); border-color: rgba(255,59,48,.28); }
.offer-delete-btn:hover { background: var(--coral-soft); border-color: var(--coral); }
.offer-send-box { padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface-2); margin-bottom: 12px; display: grid; gap: 8px; }
/* Offre envoyée non signée depuis X jours : à relancer. */
.offer-send-box.is-relance { border-left: 3px solid var(--warning, #d98a00); background: color-mix(in srgb, var(--warning, #d98a00) 10%, var(--surface)); }
.offer-send-box.is-relance .primary-button { background: var(--warning, #d98a00); border-color: var(--warning, #d98a00); }
.offer-relance-badge { flex: 0 0 auto; font-size: .62rem; font-weight: 700; white-space: nowrap; padding: 2px 7px; border-radius: 999px; color: #fff; background: var(--warning, #d98a00); }
.offer-signed-banner { padding: 12px 14px; border-radius: var(--r-md); background: var(--green-soft); color: var(--green-text); font-size: .9rem; margin-bottom: 12px; }

@media (max-width: 900px) { .crm-offers-workspace { grid-template-columns: 1fr; } .offer-form-row { grid-template-columns: 1fr; } }

/* ── Document d'offre (aperçu + page publique client) ── */
.offer-doc { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); padding: clamp(20px, 4vw, 44px); box-shadow: var(--shadow-sm); }
.offer-doc-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 16px; border-bottom: 2px solid var(--accent); margin-bottom: 20px; }
.offer-doc-logo { height: 40px; width: auto; }
.offer-doc-ref { font-size: .8rem; font-weight: 700; color: var(--text-soft); }
.offer-doc-title { font-size: clamp(1.1rem, 2.6vw, 1.5rem); font-weight: 800; letter-spacing: -.01em; margin: 0 0 14px; color: var(--text); }
.offer-doc-intro { color: var(--text-soft); margin: 0 0 20px; line-height: 1.5; }
.offer-doc-section { font-size: .82rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--accent); margin: 22px 0 8px; }
.offer-doc-list { margin: 6px 0 14px; padding-left: 22px; display: grid; gap: 7px; }
.offer-doc-list li { line-height: 1.45; }
.offer-doc-list.arrow { list-style: none; padding-left: 4px; }
.offer-doc-list.arrow li::before { content: "➔ "; color: var(--accent); font-weight: 700; }
.offer-doc-surcharge-intro { color: var(--text-soft); margin: 14px 0 6px; line-height: 1.5; }

/* ── Page publique de signature ── */
.offer-public-body { margin: 0; background: var(--surface-2); color: var(--text); }
.offer-public-shell { max-width: 780px; margin: 0 auto; padding: clamp(16px, 4vw, 40px) 16px 48px; display: grid; gap: 20px; }
.offer-flash { padding: 12px 16px; border-radius: var(--r-md); background: var(--green-soft); color: var(--green-text); font-weight: 600; }
.offer-sign-card, .offer-signed-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); padding: clamp(18px, 3vw, 32px); box-shadow: var(--shadow-sm); }
.offer-sign-card h2 { margin: 0 0 4px; }
.offer-sign-note { color: var(--text-soft); margin: 0 0 16px; }
.offer-sign-form { display: grid; gap: 14px; }
.offer-sign-form label { display: grid; gap: 5px; font-size: .78rem; font-weight: 700; color: var(--text-muted); }
.offer-sign-form input[type="text"] { padding: 11px 13px; border: 1px solid var(--border); border-radius: var(--r-md); font: inherit; }
.offer-sign-pad-wrap { display: grid; gap: 8px; }
.offer-sign-pad { width: 100%; height: 150px; border: 1px dashed var(--accent); border-radius: var(--r-md); background: #fff; touch-action: none; cursor: crosshair; }
.offer-sign-clear { justify-self: start; }
.offer-sign-submit { justify-self: start; }
/* ── Rappels Odoo (miroir lecture seule, TRANSITOIRE) — horloge barre SALES ──
   À retirer avec la table odoo_crm_reminders + le menu le jour de la bascule. */
.odoo-rem-menu { position: relative; }
.odoo-rem-clock {
  display: inline-flex; align-items: center; gap: 5px; cursor: pointer; list-style: none;
  padding: 9px 12px; border: 1px solid var(--border); border-radius: 999px;
  background: var(--surface); color: var(--text-soft); line-height: 1;
}
.odoo-rem-clock::-webkit-details-marker { display: none; }
.odoo-rem-clock:hover { border-color: var(--accent); color: var(--accent); }
.odoo-rem-menu[open] .odoo-rem-clock { border-color: var(--accent); color: var(--accent); }
.odoo-rem-pill {
  font-size: .66rem; font-weight: 800; padding: 1px 6px; border-radius: 999px; color: #fff;
}
.odoo-rem-pill.is-overdue { background: var(--coral); }
.odoo-rem-pill.is-today { background: var(--warning, #d98a00); }
.odoo-rem-drop {
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 60;
  width: min(400px, 92vw); padding: 14px;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg);
  box-shadow: var(--shadow-lg, 0 18px 40px rgba(0,0,0,.14));
  /* Le menu vit dans le bandeau SOMBRE (texte blanc) : on réinitialise la
     couleur ici, sinon le nom du client (<strong> sans couleur propre) hérite
     du blanc → blanc sur fond clair = invisible. */
  color: var(--text);
}
.odoo-rem-counts { display: flex; gap: 8px; justify-content: space-between; margin-bottom: 10px; }
/* Tuiles CLIQUABLES : filtrent la liste sur leur groupe (re-clic = tout). */
.odoo-rem-count {
  flex: 1; text-align: center; font-size: .7rem; font-weight: 600; color: var(--text-soft);
  padding: 7px 4px; border-radius: var(--r-sm, 10px); background: var(--surface-2);
  display: grid; gap: 1px; border: 1px solid transparent; cursor: pointer; font-family: inherit;
  transition: border-color var(--duration, .15s) var(--ease, ease), background var(--duration, .15s) var(--ease, ease);
}
.odoo-rem-count:hover { border-color: var(--border-strong); }
.odoo-rem-count.is-active.is-overdue { border-color: var(--coral); background: var(--coral-soft); }
.odoo-rem-count.is-active.is-today { border-color: var(--warning, #d98a00); background: color-mix(in srgb, var(--warning, #d98a00) 12%, var(--surface)); }
.odoo-rem-count.is-active.is-upcoming { border-color: var(--accent); background: var(--accent-soft); }
.odoo-rem-counts strong { font-size: 1rem; letter-spacing: -.02em; }
.odoo-rem-counts .is-overdue strong { color: var(--coral-text); }
.odoo-rem-counts .is-today strong { color: var(--warning, #d98a00); }
.odoo-rem-counts .is-upcoming strong { color: var(--accent); }
.odoo-rem-scroll { max-height: 320px; overflow-y: auto; display: grid; gap: 6px; }
.odoo-rem-group { margin: 6px 0 0; font-size: .64rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted); }
.odoo-rem-group.is-overdue { color: var(--coral-text); }
.odoo-rem-group.is-today { color: var(--warning, #d98a00); }
/* Ligne rappel = carte : lien cliquable (fiche société) + bouton « ✓ traité ». */
.odoo-rem-row {
  display: flex; align-items: stretch; gap: 4px;
  border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface);
  transition: border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease);
}
.odoo-rem-row:hover { border-color: rgba(0,113,227,.28); box-shadow: var(--shadow-sm); }
.odoo-rem-row.is-overdue { border-left: 3px solid var(--coral); }
.odoo-rem-row.is-today { border-left: 3px solid var(--warning, #d98a00); }
.odoo-rem-link {
  flex: 1 1 auto; min-width: 0; display: flex; align-items: baseline; gap: 8px;
  padding: 7px 9px; color: inherit; text-decoration: none; cursor: pointer; border-radius: inherit;
}
/* Bouton « traité » : retire le rappel de l'horloge (marquage local, pas Odoo). */
.odoo-rem-done {
  flex: 0 0 auto; align-self: center; margin-right: 5px;
  width: 26px; height: 26px; border-radius: 999px;
  border: 1px solid var(--border); background: var(--surface-alt, #f2f2f4);
  color: var(--text-muted); font-size: .85rem; line-height: 1; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background var(--duration) var(--ease), color var(--duration) var(--ease), border-color var(--duration) var(--ease);
}
.odoo-rem-done:hover { background: rgba(26,127,69,.12); color: var(--success, #1a7f45); border-color: var(--success, #1a7f45); }
.odoo-rem-done:disabled { opacity: .5; cursor: default; }
.odoo-rem-main { flex: 1 1 auto; min-width: 0; display: grid; gap: 1px; }
.odoo-rem-main strong { font-size: .82rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.odoo-rem-what { font-size: .7rem; color: var(--text-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.odoo-rem-date { flex: 0 0 auto; font-size: .7rem; color: var(--text-muted); white-space: nowrap; }
/* Rappel non importé → le clic ouvre la fiche DANS ODOO (nouvel onglet). */
.odoo-rem-ext { flex: 0 0 auto; font-size: .6rem; font-weight: 800; letter-spacing: .02em; color: var(--accent); white-space: nowrap; }
.odoo-rem-empty { margin: 4px 0; font-size: .82rem; color: var(--text-soft); }
.odoo-rem-more { margin: 2px 0 4px; font-size: .7rem; color: var(--text-muted); font-style: italic; }
.odoo-rem-foot { margin: 10px 0 0; font-size: .66rem; color: var(--text-muted); text-align: center; }

/* Refus du bon depuis le lien de signature personnel (page /bon/<token>). */
.bon-refuse-card { margin-top: 16px; border-top: 1px solid var(--border); padding-top: 12px; }
.bon-refuse-card summary { cursor: pointer; font-size: .82rem; color: var(--text-soft); }
.bon-refuse-card summary:hover { color: var(--coral-text); }
.bon-refuse-form { display: grid; gap: 10px; margin-top: 12px; }
.bon-refuse-form label { display: grid; gap: 5px; font-size: .78rem; font-weight: 700; color: var(--text-muted); }
.bon-refuse-form button { justify-self: start; color: var(--coral-text); }
.offer-signed-check { font-size: 1.1rem; font-weight: 800; color: var(--green-text); margin: 0 0 6px; }
.offer-signature-img { margin-top: 12px; max-width: 320px; border: 1px solid var(--border); border-radius: var(--r-md); background: #fff; }
.offer-public-foot { text-align: center; color: var(--text-soft); font-size: .8rem; }

/* ── Planning : bandeau d'alertes (conflits + absences) ── */
.pg-alerts { margin: 10px 0 0; border: 1px solid rgba(255,59,48,.3); background: var(--coral-soft); border-radius: var(--r-md); padding: 10px 14px; }
.pg-alerts-head { font-weight: 700; color: var(--coral-text); font-size: .9rem; margin-bottom: 8px; }
.pg-alerts-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; max-height: 190px; overflow-y: auto; }
.pg-alert-item { display: flex; align-items: flex-start; gap: 9px; background: var(--surface); border-radius: var(--r-sm); padding: 7px 10px; }
.pg-alert-icon { flex-shrink: 0; font-size: .95rem; }
.pg-alert-copy { display: grid; gap: 1px; min-width: 0; font-size: .82rem; }
.pg-alert-copy small { color: var(--text-soft); font-size: .74rem; }
.pg-alert-more { list-style: none; font-size: .78rem; color: var(--text-soft); padding: 2px 10px; }
/* Ligne d'alerte cliquable : saute directement au conflit sur la grille. */
.pg-alerts-head small { font-weight: 500; color: var(--text-soft); }
.pg-alert-item[data-alert-jump] { cursor: pointer; transition: background .12s ease, transform .12s ease; }
.pg-alert-item[data-alert-jump]:hover { background: var(--accent-soft, #e8f0fe); transform: translateX(2px); }
.pg-alert-item[data-alert-jump]:focus-visible { outline: 2px solid var(--accent, #2563EB); outline-offset: 1px; }
.pg-alert-go { flex-shrink: 0; margin-left: auto; align-self: center; color: var(--text-soft); font-weight: 700; }
.pg-alert-item[data-alert-jump]:hover .pg-alert-go { color: var(--accent, #2563EB); }
/* Barres du conflit repérées : clignotement ambre, sans toucher à la couleur
   de fond (inline) de la barre. */
.pg-bar--found { animation: pgFoundPulse .8s ease-in-out 4; }
@keyframes pgFoundPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0); }
  50% { box-shadow: 0 0 0 5px rgba(245, 158, 11, .85); }
}

/* ── Contrôles chantier (SALES) ── */
.sv-workspace { display: grid; grid-template-columns: 300px minmax(0,1fr); gap: var(--gap-lg); align-items: start; }
.sv-list { display: grid; gap: 6px; }
.sv-row { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); text-decoration: none; color: inherit; transition: border-color var(--duration) var(--ease); }
.sv-row:hover { border-color: var(--accent); }
.sv-row.is-active { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.sv-row-main { display: grid; gap: 1px; min-width: 0; flex: 1; }
.sv-row-main strong { font-size: .9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sv-row-sub { font-size: .72rem; color: var(--text-soft); }
.sv-issue-flag { color: var(--coral-text); font-weight: 700; }
.sv-sat { font-size: .7rem; font-weight: 700; padding: 2px 8px; border-radius: 999px; white-space: nowrap; }
.sv-sat-good { background: var(--green-soft); color: var(--green-text); }
.sv-sat-ok { background: var(--accent-soft); color: var(--accent); }
.sv-sat-bad { background: var(--coral-soft); color: var(--coral-text); }

.sv-form { display: grid; gap: 12px; margin-top: 4px; }
.sv-form label { display: grid; gap: 4px; font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; color: var(--text-muted); }
.sv-form input, .sv-form select, .sv-form textarea { width: 100%; padding: 9px 11px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); font: inherit; font-weight: 400; text-transform: none; letter-spacing: normal; color: var(--text); }
.sv-form textarea { resize: vertical; }
.sv-form input:focus, .sv-form select:focus, .sv-form textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.sv-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.sv-checklist { border: 1px solid var(--border); border-radius: var(--r-md); padding: 10px 14px; display: grid; gap: 8px; }
.sv-checklist legend { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; color: var(--text-muted); padding: 0 6px; }
.sv-check { display: flex; align-items: center; gap: 9px; font-size: .86rem; font-weight: 500; text-transform: none; letter-spacing: normal; color: var(--text); cursor: pointer; }
.sv-check input { width: auto; accent-color: var(--accent); }
.sv-form-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

/* Géolocalisation du chantier */
.sv-geo {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 12px 14px; border: 1px solid rgba(0,113,227,.28); border-radius: var(--r-md);
  background: var(--accent-soft);
}
.sv-geo-btn { white-space: nowrap; }
.sv-geo-status { font-size: .82rem; font-weight: 500; text-transform: none; letter-spacing: normal; color: var(--text-soft); }
.sv-geo-status a { color: var(--accent-dark); font-weight: 650; }
/* Géolocalisation obligatoire : encart en alerte + bouton d'enregistrement bloqué */
.sv-geo.is-required { border-color: rgba(229,84,75,.5); background: rgba(229,84,75,.08); }
.sv-geo.is-required .sv-geo-status { color: #c33; font-weight: 600; }
.primary-button.is-locked, .primary-button:disabled { opacity: .5; cursor: not-allowed; box-shadow: none; }

/* Photos du chantier */
.sv-photos { display: grid; gap: 10px; }

/* Zone de dépôt de fichiers (missions, contrôles chantier) */
.upload-dropzone {
  display: grid; justify-items: center; gap: 5px; padding: 32px 20px;
  border: 2px dashed var(--border); border-radius: var(--r-lg);
  background: var(--surface); cursor: pointer; text-align: center;
  transition: border-color .15s ease, background .15s ease;
}
.upload-dropzone:hover, .upload-dropzone.is-drag { border-color: var(--blue); background: var(--blue-soft); }
.upload-dropzone.is-drag { border-style: solid; }
.upload-dropzone-icon { font-size: 2rem; line-height: 1; }
.upload-dropzone-title { font-size: .95rem; }
.upload-dropzone.is-drag .upload-dropzone-title { color: var(--blue); }
.upload-dropzone-hint { font-size: .78rem; color: var(--text-muted); }
.upload-dropzone-files { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; margin-top: 10px; }
.upload-dropzone-thumb { width: 56px; height: 56px; object-fit: cover; border-radius: var(--r-sm); border: 1px solid var(--border); background: #fff; }
.upload-dropzone-files em { font-style: normal; font-size: .78rem; font-weight: 600; color: var(--blue); }
.sv-photos-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 8px; }
.sv-photo-thumb {
  display: block; aspect-ratio: 1 / 1; border-radius: var(--r-md); overflow: hidden;
  border: 1px solid var(--border); background: var(--surface-2);
}
.sv-photo-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sv-photo-thumb:hover { border-color: var(--accent); }

/* Signatures des intervenants (obligatoire pour clôturer) */
.sv-signatures { display: grid; gap: 10px; padding: 14px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface-2); }
.sv-signatures.is-required { border-color: rgba(229,84,75,.5); background: rgba(229,84,75,.06); }
.sv-sign-head { display: grid; gap: 2px; }
.sv-sign-head strong { font-size: .9rem; text-transform: none; letter-spacing: normal; }
.sv-sign-head span { font-size: .78rem; color: var(--text-soft); text-transform: none; letter-spacing: normal; font-weight: 400; }
.sv-sign-existing { display: flex; flex-wrap: wrap; gap: 10px; }
.sv-sign-existing-item { margin: 0; display: grid; gap: 3px; }
.sv-sign-existing-item img { width: 160px; height: 80px; object-fit: contain; background: #fff; border: 1px solid var(--border); border-radius: 8px; }
.sv-sign-existing-item figcaption { font-size: .76rem; font-weight: 650; color: var(--text); text-align: center; }
.sv-sign-list { display: grid; gap: 12px; }
.sv-sign-row { display: grid; gap: 6px; padding: 10px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-md); }
.sv-sign-canvas { width: 100%; height: 150px; background: #fff; border: 1px dashed rgba(0,0,0,.28); border-radius: 8px; touch-action: none; cursor: crosshair; display: block; }
.sv-sign-row-actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sv-sign-remove { width: 30px; height: 30px; border: 0; border-radius: var(--r-full); background: var(--surface-2); color: var(--text-soft); font-size: 1.2rem; line-height: 1; cursor: pointer; }
.sv-sign-remove:hover { background: rgba(229,84,75,.14); color: #e5544b; }
.sv-sign-add { justify-self: start; }
.sv-delete-form { margin: 0; }
.sv-delete-btn { color: var(--coral-text); border-color: rgba(255,59,48,.28); }
.sv-delete-btn:hover { background: var(--coral-soft); border-color: var(--coral); }

@media (max-width: 900px) { .sv-workspace { grid-template-columns: 1fr; } .sv-form-row { grid-template-columns: 1fr; } }

/* ── Bon de commande consultable (aperçu + signé) ── */
.bon-back { display: inline-block; margin-bottom: 12px; color: var(--accent); text-decoration: none; font-weight: 600; font-size: .88rem; }
.bon-back:hover { text-decoration: underline; }
.bon-fields { display: grid; gap: 6px; margin: 6px 0 4px; }
.bon-line { display: flex; justify-content: space-between; gap: 14px; margin: 0; padding: 6px 0; border-bottom: 1px solid rgba(0,0,0,.05); }
.bon-line span { color: var(--text-soft); font-size: .84rem; flex-shrink: 0; }
.bon-line strong { text-align: right; font-weight: 600; }
.bon-scope { white-space: pre-wrap; line-height: 1.5; color: var(--text); margin: 4px 0 6px; }
.bon-sign-status { border-radius: var(--r-md); padding: 12px 14px; font-size: .9rem; }
.bon-sign-status p { margin: 0 0 6px; }
.bon-sign-status.is-accepted { background: var(--green-soft); color: var(--green-text); }
.bon-sign-status.is-refused { background: var(--coral-soft); color: var(--coral-text); }
.bon-sign-status.is-pending { background: var(--gold-soft); color: var(--gold-text); }
.bon-sign-reason { font-style: italic; }
.bon-sign-img { margin-top: 8px; max-width: 300px; border: 1px solid var(--border); border-radius: var(--r-sm); background: #fff; }
.bon-tariff-note { font-size: .78rem; color: var(--text-muted); margin: 6px 0 0; }

/* Photos/plans joints à la mission — fin du bon en ligne */
.bon-photos { display: grid; gap: 14px; }
.bon-photo { margin: 0; }
.bon-photo img { display: block; width: 100%; max-width: 100%; border: 1px solid var(--border); border-radius: var(--r-md); background: #fff; }
.bon-photo figcaption { font-size: .78rem; color: var(--text-muted); margin-top: 4px; }

/* Bloc photos du formulaire mission */
.mission-photos-block { display: grid; gap: 10px; }
.mission-photos-label { font-size: .85rem; font-weight: 600; }
.mission-photos-label em { font-style: normal; font-weight: 400; color: var(--text-muted); font-size: .92em; }
.mission-photo-gallery { display: flex; flex-wrap: wrap; gap: 10px; }
.mission-photo-thumb { position: relative; margin: 0; }
.mission-photo-thumb img { display: block; width: 96px; height: 96px; object-fit: cover; border: 1px solid var(--border); border-radius: var(--r-sm); background: #fff; }
.mission-photo-remove { position: absolute; top: -7px; right: -7px; width: 22px; height: 22px; border-radius: 50%; border: none; background: var(--coral); color: #fff; font-size: .9rem; line-height: 1; cursor: pointer; }
.mission-photo-remove:hover { filter: brightness(1.1); }

/* Lien « Voir le bon » côté technicien */
.terrain-bon-view { display: inline-block; color: var(--accent); text-decoration: none; font-weight: 600; font-size: .9rem; padding: 6px 4px; }
.terrain-bon-view:hover { text-decoration: underline; }

/* ═══════════════════════════════════════════════════════════════════════════
   Bons de prestation : espace Encodage (Monika) + dépôt SMM (drag&drop)
   ═════════════════════════════════════════════════════════════════════════ */

/* ── Coquille autonome de Monika ─────────────────────────────────────────── */
.enc-body {
  margin: 0; min-height: 100vh; display: flex; flex-direction: column;
  background: var(--bg); font-family: var(--font); color: var(--text);
}






.enc-wrap { width: min(1040px, 100%); margin: 0 auto; padding: 22px 16px 64px; }

.enc-flash {
  margin: 0 0 16px; padding: 10px 14px;
  background: var(--accent-soft); border: 1px solid rgba(0,113,227,.25);
  border-radius: 10px; color: var(--accent-dark); font-size: .86rem; font-weight: 600;
}
.enc-smm-hint {
  margin: 0 0 16px; padding: 10px 14px;
  background: var(--gold-soft); border: 1px solid rgba(255,159,10,.28);
  border-radius: 10px; color: var(--gold-text); font-size: .84rem; font-weight: 600;
}
.enc-smm-hint a { color: var(--accent-dark); }

.enc-header {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 18px; flex-wrap: wrap; margin-bottom: 22px;
}
.enc-header h1 { margin: 4px 0 0; font-size: 1.5rem; letter-spacing: -.02em; }
.enc-eyebrow {
  margin: 0; font-size: .72rem; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--accent);
}
.enc-note { margin: 6px 0 0; max-width: 60ch; color: var(--text-soft); font-size: .86rem; line-height: 1.45; }
.enc-month.has-files { border-color: rgba(0,113,227,.22); }
.enc-month.has-files .enc-month-total { color: var(--green-text); }

.enc-folders {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px;
}
.enc-folder {
  display: flex; flex-direction: column; align-items: flex-start; gap: 4px;
  padding: 16px 16px 14px; text-decoration: none; text-align: left;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r-lg); color: var(--text); position: relative;
  box-shadow: var(--shadow-sm);
  transition: transform .14s var(--ease), box-shadow .14s, border-color .14s;
}
.enc-folder:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--border-strong); }
.enc-folder.has-files { border-color: rgba(0,113,227,.28); }
.enc-folder.is-empty { background: var(--surface-2); box-shadow: none; }
/* Icône dossier minimaliste : trait blanc sur pastille bleue (DA S.I.C.) */
.enc-folder-icon {
  width: 40px; height: 40px; border-radius: var(--r-md); display: grid; place-items: center;
  background: var(--accent); color: #fff;
}
.enc-folder-icon svg { width: 22px; height: 22px; }
.enc-folder.is-empty .enc-folder-icon { background: var(--accent-soft); color: var(--accent); }
.enc-folder-week { font-weight: 700; font-size: .92rem; letter-spacing: -.01em; }
.enc-folder-range { font-size: .74rem; color: var(--text-soft); }
.enc-folder-count {
  position: absolute; top: 12px; right: 12px; min-width: 22px; height: 22px; padding: 0 6px;
  display: grid; place-items: center; border-radius: var(--r-full);
  font-size: .74rem; font-weight: 800;
}
.enc-folder-count.is-empty { background: var(--surface-3); color: var(--text-muted); }
.enc-folder-count.has-files { background: var(--green); color: #fff; box-shadow: 0 2px 7px rgba(52,199,89,.38); }
/* Dossier entièrement encodé : coche verte discrète, plus de nombre vert. */
.enc-folder-count.is-done { background: rgba(52,199,89,.14); color: var(--green); box-shadow: none; font-weight: 900; }
.enc-folder.is-done { border-color: rgba(52,199,89,.30); }
.enc-picker-total small { font-weight: 600; color: var(--text-muted); margin-left: 5px; }

/* ── Contenu d'un dossier-semaine ────────────────────────────────────────── */
.enc-back { display: inline-block; margin-bottom: 4px; color: var(--accent); text-decoration: none; font-size: .82rem; font-weight: 600; }
.enc-back:hover { text-decoration: underline; }
.enc-week-header { align-items: center; }
.enc-week-title { display: flex; align-items: center; gap: 12px; margin: 2px 0; }
.enc-week-title h1 { margin: 0; }
.enc-week-nav {
  width: 36px; height: 36px; flex-shrink: 0; display: grid; place-items: center;
  border-radius: var(--r-full); background: var(--surface-2); color: var(--text-soft);
  text-decoration: none; font-size: 1.3rem; line-height: 1;
  transition: background .12s, color .12s, transform .08s;
}
.enc-week-nav:hover { background: var(--accent); color: #fff; }
.enc-week-nav:active { transform: scale(.92); }
.enc-week-nav.is-disabled { opacity: .3; pointer-events: none; }

/* Relances heures manquantes (Encodage) */
.enc-relance-card {
  margin-top: 22px; padding: 20px; border: 1px solid var(--border); border-radius: var(--r-lg);
  background: var(--surface); display: flex; flex-wrap: wrap; gap: 16px; align-items: center;
  justify-content: space-between;
}
.enc-relance-head { flex: 1 1 300px; }
.enc-relance-head h2 { margin: 0 0 4px; font-size: 1.05rem; }
.enc-relance-action { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.enc-relance-go { white-space: nowrap; }
.enc-relance-wait { display: flex; align-items: center; gap: 10px; font-size: .9rem; color: var(--text-soft); }
.enc-relance-wait b { color: var(--accent); font-variant-numeric: tabular-nums; }
.enc-relance-skip { color: var(--accent); text-decoration: none; font-weight: 600; font-size: .82rem; }
.enc-relance-skip:hover { text-decoration: underline; }
.enc-relance-spin {
  width: 16px; height: 16px; border-radius: var(--r-full);
  border: 2px solid var(--border); border-top-color: var(--accent);
  animation: enc-relance-spin .8s linear infinite; display: inline-block;
}
@keyframes enc-relance-spin { to { transform: rotate(360deg); } }

.enc-relance-blocked {
  display: flex; align-items: center; gap: 10px; font-size: .9rem; color: var(--text-soft);
  background: var(--surface-2); border: 1px dashed var(--border); border-radius: var(--r-md);
  padding: 10px 14px; max-width: 380px;
}
.enc-relance-blocked b { color: var(--text); }
.enc-relance-blocked-icon { font-size: 1.1rem; }
.enc-relance-sync { color: var(--text-soft); font-size: .82rem; }
.enc-relance-howto { margin: 0 0 16px; color: var(--text-soft); font-size: .9rem; }
.enc-relance-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.enc-relance-item { border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--surface); padding: 14px 16px; }
.enc-relance-item-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.enc-relance-name { display: block; font-size: 1rem; }
.enc-relance-meta { color: var(--text-soft); font-size: .82rem; }
.enc-relance-phone { font-size: .82rem; color: var(--text-soft); white-space: nowrap; }
.enc-relance-phone.is-missing { color: var(--danger, #c0392b); opacity: .8; }
.enc-relance-msg {
  width: 100%; box-sizing: border-box; resize: vertical; font: inherit; font-size: .9rem;
  line-height: 1.45; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--r-md);
  background: var(--surface-2); color: var(--text);
}
.enc-relance-item-actions { display: flex; justify-content: flex-end; margin-top: 8px; }
.enc-relance-copy.is-copied { background: var(--ok, #1e8e5a); border-color: var(--ok, #1e8e5a); }
.enc-relance-empty { text-align: center; padding: 48px 16px; color: var(--text-soft); }
.enc-relance-empty-emoji { font-size: 2.4rem; display: block; margin-bottom: 10px; }
@media (max-width: 560px) {
  .enc-relance-card { flex-direction: column; align-items: stretch; }
  .enc-relance-action { align-items: stretch; }
  .enc-relance-go { text-align: center; }
}
.enc-week-count {
  padding: 5px 12px; border-radius: var(--r-full);
  background: var(--surface-2); color: var(--text-soft); font-size: .8rem; font-weight: 600;
}
.enc-slips { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.enc-slip {
  display: flex; align-items: center; gap: 14px; padding: 10px 12px;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r-md); box-shadow: var(--shadow-sm);
}
.enc-slip-thumb {
  width: 56px; height: 56px; flex-shrink: 0; border-radius: 10px; overflow: hidden;
  background: var(--surface-2); display: grid; place-items: center; text-decoration: none;
}
.enc-slip-thumb img { width: 100%; height: 100%; object-fit: cover; }
.enc-slip-ext { font-size: .74rem; font-weight: 800; color: var(--accent); letter-spacing: .04em; }
.enc-slip-body { flex: 1; min-width: 0; }
.enc-slip-name {
  display: block; font-weight: 600; color: var(--text); text-decoration: none;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.enc-slip-name:hover { color: var(--accent); }
.enc-slip-meta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 3px; font-size: .76rem; color: var(--text-soft); }
.enc-slip-client { font-weight: 600; color: var(--text); }
.enc-slip-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.enc-slip-dl {
  padding: 6px 12px; border-radius: 8px; background: var(--accent-soft);
  color: var(--accent-dark); font-size: .8rem; font-weight: 600; text-decoration: none;
}
.enc-slip-dl:hover { background: rgba(0,113,227,.16); }
.enc-slip-del-btn {
  padding: 6px 10px; border: 0; border-radius: 8px; cursor: pointer;
  background: var(--coral-soft); color: var(--coral-text); font-size: .8rem; font-weight: 600;
}
.enc-slip-del-btn:hover { background: rgba(255,59,48,.16); }
.enc-slip-empty {
  padding: 28px 12px; text-align: center; color: var(--text-muted);
  background: var(--surface-2); border: 1px dashed var(--border-strong); border-radius: var(--r-md);
}

/* ── Dépôt SMM : zones de semaine en drag&drop ───────────────────────────── */
.presta-monthnav { display: flex; align-items: center; gap: 10px; margin: 4px 0 16px; flex-wrap: wrap; }
.presta-month { font-size: 1.05rem; }
.presta-see-monika {
  margin-left: auto; padding: 6px 12px; border-radius: var(--r-full);
  background: var(--surface-2); color: var(--text-soft); font-size: .8rem; font-weight: 600; text-decoration: none;
}
.presta-see-monika:hover { background: var(--surface-3); color: var(--text); }
.presta-zones {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 14px;
}
.presta-zone {
  display: flex; flex-direction: column; gap: 6px; padding: 14px;
  min-height: 168px; cursor: pointer;
  background: var(--surface); border: 2px dashed var(--border-strong);
  border-radius: var(--r-lg); transition: border-color .12s, background .12s, transform .12s;
}
.presta-zone:hover { border-color: var(--accent); }
.presta-zone:focus-visible { outline: none; box-shadow: var(--shadow-focus); }
.presta-zone.is-dragover { border-color: var(--accent); background: var(--accent-soft); transform: scale(1.01); }
.presta-zone.is-uploading { opacity: .7; }
.presta-zone-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.presta-zone-week { font-weight: 800; font-size: .92rem; }
.presta-zone-open { font-size: .76rem; color: var(--accent); text-decoration: none; font-weight: 600; }
.presta-zone-open:hover { text-decoration: underline; }
.presta-zone-range { font-size: .78rem; color: var(--text-soft); }
.presta-zone-shared {
  align-self: flex-start; padding: 2px 8px; border-radius: var(--r-full);
  background: var(--gold-soft); color: var(--gold-text); font-size: .7rem; font-weight: 700;
}
.presta-zone-drop {
  margin-top: auto; display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 12px 8px; border-radius: var(--r-md); background: var(--surface-2); text-align: center;
}
.presta-zone-hint { font-size: .76rem; color: var(--text-muted); line-height: 1.35; }
.presta-zone-count {
  padding: 3px 12px; border-radius: var(--r-full); font-size: .74rem; font-weight: 700;
}
.presta-zone-count.is-empty { background: var(--surface-3); color: var(--text-muted); }
.presta-zone-count.has-files { background: var(--green); color: #fff; }
.presta-zone-feedback { min-height: 1em; font-size: .74rem; font-weight: 600; text-align: center; }
.presta-zone-feedback.is-ok { color: var(--green-text); }
.presta-zone-feedback.is-error { color: var(--coral-text); }
.presta-zone-feedback.is-pending { color: var(--text-soft); }

@media (max-width: 640px) {
  .enc-folders { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
  .presta-zones { grid-template-columns: 1fr; }
  .enc-slip-thumb { width: 46px; height: 46px; }
}

/* Vue Encodage : intro centrée + navigateur de mois (année à gauche, mois centré) */
.enc-intro { text-align: center; max-width: 62ch; margin: 6px auto 20px; }
.enc-intro .enc-eyebrow { color: var(--accent); }
.enc-intro .enc-note { margin: 8px auto 0; }

.enc-picker-bar {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px;
  margin: 0 0 28px; padding: 14px 18px;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r-xl); box-shadow: var(--shadow-sm);
}
.enc-picker-year { justify-self: start; display: inline-flex; align-items: center; gap: 4px; }
.enc-picker-year-value { min-width: 3.4ch; text-align: center; font-size: .98rem; font-weight: 700; color: var(--text); }
.enc-picker-month { justify-self: center; display: inline-flex; align-items: center; gap: 16px; }
.enc-picker-month-value {
  margin: 0; min-width: 6.2em; text-align: center;
  font-size: 2rem; font-weight: 800; letter-spacing: -.03em; color: var(--text); line-height: 1.1;
}
.enc-picker-total {
  justify-self: end; padding: 6px 14px; border-radius: var(--r-full);
  background: var(--surface-2); color: var(--text-soft); font-size: .82rem; font-weight: 600; white-space: nowrap;
}
.enc-picker-total strong { color: var(--text); font-weight: 800; }

/* Chevrons de navigation — ronds, virent à l'accent au survol */
.enc-nav {
  width: 34px; height: 34px; flex-shrink: 0; display: grid; place-items: center;
  border-radius: var(--r-full); background: var(--surface-2); color: var(--text-soft);
  text-decoration: none; font-size: 1.15rem; line-height: 1;
  transition: background .12s, color .12s, transform .08s;
}
.enc-nav:hover { background: var(--accent); color: #fff; }
.enc-nav:active { transform: scale(.92); }
.enc-nav-lg {
  width: 44px; height: 44px; font-size: 1.45rem;
  background: var(--surface); border: 1px solid var(--border); color: var(--text);
}
.enc-nav-lg:hover { background: var(--accent); color: #fff; border-color: var(--accent); }

.enc-folders-month { margin-top: 4px; }

@media (max-width: 560px) {
  .enc-picker-bar { grid-template-columns: 1fr; justify-items: center; gap: 14px; }
  .enc-picker-year, .enc-picker-total { justify-self: center; }
  .enc-picker-month-value { font-size: 1.7rem; }
}

/* Fiche technicien : dépôt auto en drag&drop + date de validité document */
.rh-tech-doc-dropzone.is-uploading { opacity: .65; pointer-events: none; }
.rh-document-expiry {
  display: block; margin-top: 2px; font-size: .72rem; font-weight: 600; font-style: normal;
}
.rh-document-expiry.is-valid { color: var(--green-text); }
.rh-document-expiry.is-expired { color: var(--coral-text); }

/* Nom de technicien cliquable dans les alertes CDD / conformité → fiche */
.rh-tech-name-link { color: inherit; text-decoration: none; }
.rh-tech-name-link:hover { color: var(--accent); text-decoration: underline; }

/* Alerte « date de début de contrat manquante » sur la fiche technicien */
.rh-contract-missing-warn {
  margin: 8px 0; padding: 8px 12px; border-radius: 10px;
  background: var(--gold-soft); border: 1px solid rgba(255,159,10,.30);
  color: var(--gold-text); font-size: .8rem; font-weight: 600; line-height: 1.35;
}
.rh-contract-missing-start { color: var(--gold-text); font-weight: 700; }

/* « Bibliothèque récente » repliable (onglet Documents RH) */
.rh-doc-library { margin-top: 14px; }
.rh-doc-library > summary {
  list-style: none; cursor: pointer; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
  padding: 10px 14px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface-2);
}
.rh-doc-library > summary::-webkit-details-marker { display: none; }
.rh-doc-library > summary:hover { background: var(--surface-3); }
.rh-doc-library-chevron { color: var(--text-soft); transition: transform .15s; }
.rh-doc-library[open] .rh-doc-library-chevron { transform: rotate(90deg); }
.rh-doc-library-hint { font-size: .74rem; color: var(--text-muted); font-weight: 400; }
.rh-doc-library[open] .rh-document-list { margin-top: 12px; }

/* Tableau RH : tuiles épurées — chiffre en gras centré, sans texte sous le nombre */
.rh-dashboard-card {
  justify-items: center;
  align-content: center;
  text-align: center;
  gap: 8px;
  min-height: 104px;
}
.rh-dashboard-card strong { font-size: 2.3rem; }

/* ── Vue Encodage : barre d'outils de sélection ─────────────────────────── */
.enc-toolbar {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  margin: 0 0 14px; padding: 10px 14px;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r-md); box-shadow: var(--shadow-sm);
}
.enc-check-all { display: inline-flex; align-items: center; gap: 8px; font-size: .84rem; font-weight: 600; cursor: pointer; }
.enc-check-all input { width: 17px; height: 17px; accent-color: var(--accent); }
.enc-sel-count { font-size: .8rem; color: var(--text-soft); }
.enc-toolbar-actions { margin-left: auto; display: inline-flex; gap: 8px; }
.enc-btn {
  border: 0; border-radius: 9px; padding: 8px 14px; font-size: .84rem; font-weight: 650;
  cursor: pointer; transition: background .12s, opacity .12s;
}
.enc-btn:disabled { opacity: .45; cursor: not-allowed; }
.enc-btn-primary { background: var(--accent); color: #fff; }
.enc-btn-primary:not(:disabled):hover { background: var(--accent-dark); }
.enc-btn-ghost { background: var(--surface-2); color: var(--text-soft); }
.enc-btn-ghost:not(:disabled):hover { background: var(--surface-3); color: var(--text); }

.enc-week-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.enc-week-progress { font-size: .76rem; color: var(--text-soft); }
.enc-week-progress b { color: var(--gold-text); }

/* ── Ligne de bon : checkbox, boutons-vignette, badges statut/doublon ────── */
.enc-slip-check { display: grid; place-items: center; padding-right: 2px; }
.enc-slip-check input { width: 18px; height: 18px; accent-color: var(--accent); cursor: pointer; }
/* Bon DÉJÀ ENCODÉ : rangée grisée (relayée en bas de liste), aperçu marqué. */
.enc-slip.is-encoded { background: var(--surface-2); border-color: rgba(52,199,89,.28); }
.enc-slip.is-encoded .enc-slip-name,
.enc-slip.is-encoded .enc-slip-meta > span { color: var(--text-muted); }
.enc-slip.is-encoded .enc-slip-thumb img { filter: grayscale(.35) opacity(.72); }
.enc-slip-thumb { position: relative; }
.enc-slip-wm {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 1px 0;
  background: rgba(52,199,89,.92); color: #fff; pointer-events: none;
  font-size: .42rem; font-weight: 900; letter-spacing: .06em; text-align: center; line-height: 1.35;
}
/* Filigrane « ENCODÉ » plein écran (lightbox) — dissuade le double encodage. */
.enc-lb-wm { display: none; }
.enc-lb.is-encoded .enc-lb-wm {
  display: grid; place-items: center; position: absolute; inset: 0; z-index: 2;
  pointer-events: none; color: rgba(52,199,89,.32);
  font-size: clamp(2.6rem, 15vw, 11rem); font-weight: 900; letter-spacing: .1em;
  transform: rotate(-24deg); text-shadow: 0 3px 26px rgba(0,0,0,.18);
}
.enc-lb-close, .enc-lb-nav { z-index: 6; }
.enc-slip.is-duplicate { border-color: rgba(255,159,10,.45); }
button.enc-slip-thumb { border: 1px solid var(--border); padding: 0; cursor: zoom-in; }
button.enc-slip-name {
  background: none; border: 0; padding: 0; font: inherit; text-align: left; cursor: pointer;
  color: var(--text); font-weight: 600;
}
button.enc-slip-name:hover { color: var(--accent); }
.enc-slip-status { font-size: .72rem; font-weight: 700; padding: 2px 8px; border-radius: var(--r-full); }
.enc-slip-status.is-todo { background: var(--surface-3); color: var(--text-muted); }
.enc-slip-status.is-done { background: var(--green-soft); color: var(--green-text); }
.enc-slip-dup { font-size: .72rem; font-weight: 700; padding: 2px 8px; border-radius: var(--r-full); background: var(--gold-soft); color: var(--gold-text); }
.enc-slip-dl { border: 0; cursor: pointer; }

/* Note « bon incomplet » (dates/chantier manquants) — Encodage → SMM. */
.enc-slip.has-note { border-left: 3px solid var(--warning, #d98a00); }
.enc-slip-notice {
  font-size: .72rem; font-weight: 700; padding: 2px 8px; border-radius: var(--r-full);
  background: color-mix(in srgb, var(--warning, #d98a00) 15%, var(--surface)); color: var(--warning, #d98a00);
  cursor: help;
}
.enc-note { margin-top: 6px; }
.enc-note summary { cursor: pointer; font-size: .74rem; color: var(--text-soft); list-style: none; }
.enc-note summary::-webkit-details-marker { display: none; }
.enc-note summary:hover { color: var(--accent); }
.enc-note[open] summary { color: var(--warning, #d98a00); font-weight: 600; }
.enc-note-form { display: grid; gap: 6px; margin-top: 6px; max-width: 480px; }
.enc-note-form textarea {
  padding: 8px 10px; font: inherit; font-size: .8rem;
  border: 1px solid var(--border); border-radius: var(--r-sm, 10px); resize: vertical;
}
.enc-note-actions { display: flex; gap: 8px; }

/* ── Lightbox (aperçu plein écran flouté, navigation clavier) ────────────── */
.enc-lb {
  position: fixed; inset: 0; z-index: 4000;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 4vh 2vw;
  background: rgba(12,17,24,.62);
  -webkit-backdrop-filter: blur(9px); backdrop-filter: blur(9px);
  animation: encLbIn .16s var(--ease);
}
@keyframes encLbIn { from { opacity: 0; } to { opacity: 1; } }
.enc-lb[hidden] { display: none; }
.enc-lb-stage {
  flex: 0 1 auto; display: flex; align-items: center; justify-content: center;
  max-width: 92vw; max-height: 88vh;
}
.enc-lb-img {
  max-width: 100%; max-height: 88vh; object-fit: contain;
  border-radius: var(--r-md); box-shadow: 0 20px 60px rgba(0,0,0,.5); background: #fff;
}
.enc-lb-frame {
  width: min(1000px, 90vw); height: 88vh; border: 0;
  border-radius: var(--r-md); box-shadow: 0 20px 60px rgba(0,0,0,.5); background: #fff;
}
.enc-lb-nav {
  flex-shrink: 0; width: 52px; height: 52px; display: grid; place-items: center;
  border: 0; border-radius: var(--r-full); cursor: pointer;
  background: rgba(255,255,255,.14); color: #fff; font-size: 1.9rem; line-height: 1;
  transition: background .12s, transform .08s;
}
.enc-lb-nav:hover { background: rgba(255,255,255,.28); }
.enc-lb-nav:active { transform: scale(.9); }
.enc-lb-nav:disabled { opacity: 0; pointer-events: none; }
.enc-lb-close {
  position: absolute; top: 16px; right: 18px; width: 40px; height: 40px;
  display: grid; place-items: center; border: 0; border-radius: var(--r-full); cursor: pointer;
  background: rgba(255,255,255,.14); color: #fff; font-size: 1.1rem;
}
.enc-lb-close:hover { background: rgba(255,255,255,.28); }
.enc-lb-caption {
  position: absolute; left: 0; right: 0; bottom: 14px;
  display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap;
  color: rgba(255,255,255,.92); font-size: .84rem;
}
.enc-lb-caption strong { font-weight: 700; }
.enc-lb-caption span { color: rgba(255,255,255,.6); }
.enc-lb-caption a { color: #fff; text-decoration: underline; font-weight: 600; }

@media (max-width: 560px) {
  .enc-lb-nav { width: 42px; height: 42px; font-size: 1.5rem; }
  .enc-toolbar-actions { margin-left: 0; width: 100%; }
  .enc-btn { flex: 1; }
}

/* Loupe de la lightbox Encodage : pastille agrandie suivant le curseur */
.enc-lb-imgwrap { position: relative; display: inline-flex; line-height: 0; cursor: crosshair; }
.enc-lb-lens {
  position: absolute; display: none; width: 190px; height: 190px; border-radius: 50%;
  border: 3px solid rgba(255,255,255,.92); pointer-events: none; z-index: 3;
  background-repeat: no-repeat; background-color: #fff;
  box-shadow: 0 8px 28px rgba(0,0,0,.55), inset 0 0 0 1px rgba(0,0,0,.12);
}
@media (hover: none) { .enc-lb-imgwrap { cursor: default; } .enc-lb-lens { display: none !important; } }

/* Lightbox Encodage : outils de rotation (redresser un bon) */
.enc-lb-tools { position: absolute; top: 16px; left: 18px; display: flex; gap: 8px; z-index: 4; }
.enc-lb-tool {
  width: 40px; height: 40px; display: grid; place-items: center; border: 0; border-radius: var(--r-full);
  cursor: pointer; background: rgba(255,255,255,.14); color: #fff; font-size: 1.25rem; line-height: 1;
  transition: background .12s;
}
.enc-lb-tool:hover { background: rgba(255,255,255,.28); }
.enc-lb-tool:disabled { opacity: .5; cursor: default; }

/* ===== Matrice d'accès par compte (Comptes & accès — lot 1 lecture seule) ===== */
.am-panel { margin-top: 18px; }
.am-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin: 4px 0 12px; font-size: .82rem; color: var(--text-soft); }
.am-legend i { font-style: normal; }
.am-legend-sep { color: var(--text-soft); }
.am-scroll { overflow-x: auto; border: 1px solid var(--line, #e2e8f0); border-radius: 12px; }
.am-table { border-collapse: collapse; width: 100%; font-size: .8rem; }
.am-table th, .am-table td { border-bottom: 1px solid var(--line, #eef2f6); border-right: 1px solid var(--line, #eef2f6); padding: 7px 8px; text-align: center; white-space: nowrap; }
.am-table thead th { position: sticky; top: 0; background: #f8fafc; font-weight: 700; color: #334155; vertical-align: bottom; }
.am-appcol { max-width: 92px; white-space: normal; line-height: 1.15; font-size: .74rem; }
.am-appcol.am-sensitive { background: #fff7ed; color: #9a3412; }
.am-account { text-align: left; background: #fff; position: sticky; left: 0; z-index: 1; min-width: 150px; }
.am-account strong { display: block; font-size: .86rem; }
.am-account small { color: var(--text-soft); font-size: .72rem; }
.am-corner { z-index: 2; background: #f8fafc; }
.am-adminbadge { display: inline-block; margin-left: 5px; padding: 1px 6px; border-radius: 999px; background: #fef3c7; color: #92400e; font-size: .64rem; font-weight: 700; }
.am-cell { font-size: .9rem; }
.am-cell.am-none { color: #cbd5e1; }
.am-cell.am-read { background: #eff6ff; }
.am-cell.am-write { background: #ecfdf5; }
.am-cell.am-admin { background: #fffbeb; }
.am-cell.am-override { box-shadow: inset 0 0 0 2px #6366f1; }
/* Matrice d'accès — édition (lot 2) */
.am-select { border: 1px solid transparent; background: transparent; font-size: .82rem; padding: 2px 3px; border-radius: 6px; cursor: pointer; max-width: 96px; color: #1e293b; }
.am-select:hover, .am-select:focus { border-color: #cbd5e1; background: #fff; outline: none; }
.am-cell.am-locked { cursor: not-allowed; }
.am-count-badge { font-size: .8rem; color: var(--text-soft); white-space: nowrap; }
.am-shadow-banner { margin: 4px 0 12px; }
/* Matrice d'accès : l'enforcement est ACTIF — le bandeau doit alerter, pas rassurer. */
.am-shadow-banner.is-live { border-left: 3px solid var(--warning, #d98a00); background: rgba(217,138,0,.07); }
.am-shadow-banner.is-live strong { color: var(--warning, #d98a00); }
.am-status { margin-top: 10px; font-size: .84rem; font-weight: 600; }
.am-status.is-ok { color: #047857; }
.am-status.is-err { color: #b91c1c; }

/* Corriger la fiche depuis la session d'appel (audit 2026-07-28) : il n'existait
   aucune surface d'édition côté SALES — un téléphone erroné était indélébile. */
.crm-context-correct { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 12px; }
.crm-context-correct > summary {
  cursor: pointer; font-weight: 600; font-size: 0.85rem; color: var(--muted);
  list-style: none; padding: 4px 0;
}
.crm-context-correct > summary:hover { color: var(--accent); }
.crm-context-correct[open] > summary { color: var(--text); }
.crm-context-correct-form {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px; margin-top: 10px; align-items: end;
}
.crm-context-correct-form label {
  display: flex; flex-direction: column; gap: 4px;
  font-size: 0.78rem; color: var(--muted);
}
.crm-context-correct-form input {
  padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--surface); color: var(--text); font-size: 0.88rem;
}
.crm-context-correct-form button {
  padding: 9px 14px; border: 0; border-radius: 8px; cursor: pointer;
  background: var(--accent); color: #fff; font-weight: 600; font-size: 0.85rem;
}
.crm-context-correct-form button:hover { background: var(--accent-dark); }

/* ══ Débordements mobile & classes orphelines (audit hygiène 2026-07-28) ══════
   Cause racine commune aux six débordements mesurés : un enfant de grille ou de
   flex a `min-width: auto` par défaut — il refuse donc de descendre sous la
   largeur de son contenu, et tout `overflow-x: auto` posé À L'INTÉRIEUR reste
   inopérant. Il faut `min-width: 0` sur TOUTE la chaîne d'ancêtres. */
main.workspace-stack > *,
main.workspace-stack section.panel { min-width: 0; }

/* Comptes & accès : la matrice débordait de 682 px MÊME en 1280 px. */
.am-panel, .am-scroll { min-width: 0; }

/* Cockpit SMM : 754 px de large sur un téléphone de 375 px. */
.smm-activity-panel, .smm-activity-chart { min-width: 0; }
@media (max-width: 720px) {
  .smm-activity-chart { max-width: 100%; }
}

/* Pointages et rentabilité : les colonnes Pause / Net étaient inatteignables.
   Même motif que .history-table-wrap et .eval-table-wrap, déjà en place. */
.tcheck-table-wrap { overflow-x: auto; min-width: 0; -webkit-overflow-scrolling: touch; }

/* Évaluations : l'en-tête de fiche ne se repliait jamais (197 px de débord). */
.eval-detail-header { flex-wrap: wrap; }
.eval-detail-header > * { min-width: 0; }

/* Planning : la grille défilait bien, mais pas la barre d'outils ni la légende. */
@media (max-width: 820px) {
  .pg-toolbar-top, .pg-legends { flex-wrap: wrap; min-width: 0; }
  .pg-legends { margin-left: 0; }
}

/* Classes ORPHELINES — posées dans le HTML, jamais définies ici. */
/* Ligne de contexte des notifications : sur TOUTES les pages du bureau. */
.notification-meta { font-size: 0.72rem; color: var(--text-muted); margin-top: 2px; }
/* SALES /mission — bloc « Préparation du bon » : titre et score s'empilaient. */
.mission-readiness-roadmap {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: 14px; padding: 16px; margin-top: 14px;
}
.mission-readiness-header,
.mission-order-banner {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 14px; flex-wrap: wrap;
}
.crm-context-correct-form button.is-danger { background: var(--danger, #d64545); }
.crm-context-correct-form button.is-danger:hover { filter: brightness(0.92); }

/* Diffusion d'une évaluation clôturée (Thomas 2026-07-28) */
.eval-send-form { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 10px; }
.eval-send-hint { font-size: 0.78rem; color: var(--text-muted); display: block; margin-top: 8px; }
.eval-send-hint.is-done { color: var(--success, #2c8a5a); font-weight: 600; }

/* Planning fluide (2026-07-28) : plus aucun rechargement de page.
   Le retour d'action passe par un bandeau discret au lieu du flash pleine page,
   et la grille signale son rafraîchissement sans bouger d'un pixel. */
.pg-toast {
  position: fixed; left: 50%; bottom: 26px; transform: translate(-50%, 16px);
  max-width: min(560px, calc(100vw - 32px));
  padding: 11px 18px; border-radius: 10px;
  background: var(--text, #1D1D1F); color: #fff;
  font-size: 0.86rem; line-height: 1.35; font-weight: 500;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.22);
  opacity: 0; pointer-events: none; z-index: 9000;
  transition: opacity 0.18s ease, transform 0.18s ease;
}
.pg-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }
.pg-toast.is-error { background: var(--danger, #d64545); }
.pg-scroll.is-refreshing { opacity: 0.72; transition: opacity 0.12s ease; }
.pg-scroll.is-refreshing [data-pg-grid] { pointer-events: none; }

/* ================================================================
   SUIVI DE RECRUTEMENT — la ligne du temps d'un candidat
   Même vocabulaire visuel que « la semaine de Loïc » : des jalons
   reliés à l'horizontale, franchis en plein, à venir en creux.
   ================================================================ */
.rh-appli-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 0 0 14px; }
.rh-appli-toolbar input[type="search"] {
  flex: 1 1 220px;
  min-width: 180px;
  border: 1px solid var(--surface-3, #E5E5EA);
  border-radius: var(--r-full, 999px);
  padding: 8px 14px;
  font-size: .85rem;
  background: var(--surface, #FFF);
  color: var(--text, #1D1D1F);
}
.rh-appli-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.rh-appli-filter {
  border: 1px solid var(--surface-3, #E5E5EA);
  background: var(--surface, #FFF);
  border-radius: var(--r-full, 999px);
  padding: 6px 12px;
  font-size: .78rem;
  font-weight: 600;
  color: var(--text-soft, #6E6E73);
  cursor: pointer;
}
.rh-appli-filter b { color: var(--text, #1D1D1F); margin-left: 4px; }
.rh-appli-filter:hover { background: var(--surface-2, #F2F2F7); }
.rh-appli-filter.is-active {
  border-color: var(--accent, #0071E3);
  color: var(--accent, #0071E3);
  box-shadow: inset 0 0 0 1px var(--accent, #0071E3);
}

.rh-appli-list { display: grid; gap: 12px; }
.rh-appli-card { display: grid; gap: 12px; padding: 16px; }
.rh-appli-head { display: flex; flex-wrap: wrap; gap: 4px 12px; justify-content: space-between; align-items: baseline; }
.rh-appli-head strong { font-size: .96rem; }
.rh-appli-offer { display: block; font-size: .8rem; color: var(--text-soft, #6E6E73); }
.rh-appli-contact { font-size: .78rem; color: var(--text-soft, #6E6E73); }
.rh-appli-badge {
  margin-left: 8px;
  border-radius: var(--r-full, 999px);
  padding: 2px 10px;
  font-size: .72rem;
  font-weight: 700;
}
.rh-appli-trade {
  margin-left: 8px;
  border-radius: var(--r-full, 999px);
  padding: 2px 10px;
  font-size: .72rem;
  font-weight: 600;
  background: var(--surface-2, #F2F2F7);
  color: var(--text-soft, #6E6E73);
}
.rh-appli-badge.is-hired { background: rgba(52,199,89,.16); color: #1E7A34; }
.rh-appli-badge.is-rejected { background: rgba(142,142,147,.18); color: #5A5A5F; }

/* La ligne du temps : les jalons sont reliés par un trait continu, tracé en
   fond de liste pour rester droit quels que soient les libellés. */
.rh-appli-timeline {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 6px 0 0;
  overflow-x: auto;
}
.rh-appli-step {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 3px;
  padding: 14px 4px 0;
  min-width: 92px;
  text-align: center;
}
.rh-appli-step::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--surface-3, #E5E5EA);
}
.rh-appli-step:first-child::before { left: 50%; }
.rh-appli-step:last-child::before { right: 50%; }
.rh-appli-step.is-done::before { background: var(--accent, #0071E3); }
.rh-appli-dot {
  position: absolute;
  top: 0;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--surface, #FFF);
  border: 2px solid var(--surface-3, #E5E5EA);
}
.rh-appli-step.is-done .rh-appli-dot { background: var(--accent, #0071E3); border-color: var(--accent, #0071E3); }
.rh-appli-step.is-current .rh-appli-dot { box-shadow: 0 0 0 4px rgba(0,113,227,.18); }
.rh-appli-step.is-hired .rh-appli-dot { background: #34C759; border-color: #34C759; }
.rh-appli-step.is-rejected .rh-appli-dot { background: #8E8E93; border-color: #8E8E93; }
.rh-appli-step-label { font-size: .76rem; font-weight: 600; color: var(--text-soft, #6E6E73); }
.rh-appli-step.is-done .rh-appli-step-label { color: var(--text, #1D1D1F); }
.rh-appli-step-date { font-size: .7rem; color: var(--text-soft, #6E6E73); }

/* Carte entièrement cliquable : le lien s'étire sur toute la carte, les
   actions et les autres liens passent au-dessus. Un vrai <a>, donc clavier,
   nouvel onglet et lecteur d'écran fonctionnent sans JavaScript. */
.rh-appli-card { position: relative; }
.rh-appli-open {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  z-index: 0;
}
.rh-appli-card:hover { border-color: rgba(0,113,227,.35); }
.rh-appli-card:focus-within { outline: 2px solid var(--accent, #0071E3); outline-offset: 2px; }
.rh-appli-card > *:not(.rh-appli-open) { position: relative; z-index: 1; }
/* …sauf que les zones de TEXTE ne doivent pas capter le clic : sinon la carte
   n'est cliquable que dans ses marges. Seuls les éléments interactifs le font. */
.rh-appli-head, .rh-appli-timeline { pointer-events: none; }
.rh-appli-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.rh-appli-actions a, .rh-appli-actions button { pointer-events: auto; }
.rh-appli-act { display: inline; margin: 0; }
/* Les actions d'une candidature sont des boutons du DESIGN SYSTEM (primary-button
   / ghost-button), simplement resserrés : `btn-small` n'a jamais existé dans ce
   projet — les miens étaient donc sans aucun style (2026-07-30). */
.rh-appli-btn { padding: 7px 14px; font-size: .8rem; }
.rh-appli-archives { margin-top: 16px; }
.rh-appli-archives summary { cursor: pointer; font-size: .82rem; font-weight: 600; color: var(--text-soft, #6E6E73); }
.rh-appli-archives .rh-appli-list { margin-top: 10px; }
.rh-appli-archives .rh-appli-card { opacity: .78; }

@media (max-width: 720px) {
  .rh-appli-timeline { grid-auto-flow: column; }
  .rh-appli-step { min-width: 84px; }
}

/* ================================================================
   COCKPIT SMM — trois zones (refonte 2026-07-30)
   Ma semaine · l'évolution de Loïc · l'encodage. Rien à remplir à la
   main : les blocs à saisir de la version précédente restaient vides.
   ================================================================ */
.smm-cockpit-head { display: grid; gap: 2px; margin-bottom: 4px; }
.smm-cockpit-head h2 { margin: 0; font-size: 1.5rem; }
.smm-cockpit-date { margin: 0; color: var(--text-soft, #6E6E73); font-size: .86rem; }
.smm-zone { display: grid; gap: 14px; }
.smm-zero { margin: 0; color: var(--text-soft, #6E6E73); }

/* Zone 1 — ce qui m'attend */
.smm-todo-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.smm-todo {
  display: grid;
  gap: 2px;
  padding: 14px 16px;
  border: 1px solid var(--surface-3, #E5E5EA);
  border-radius: var(--r-md, 12px);
  background: var(--surface, #FFF);
  text-decoration: none;
  color: inherit;
}
.smm-todo:hover { border-color: rgba(0,113,227,.35); background: var(--surface-2, #F2F2F7); }
.smm-todo strong { font-size: 1.9rem; line-height: 1.05; color: var(--accent, #0071E3); }
.smm-todo.is-urgent strong { color: #D70015; }
.smm-todo-label { font-size: .9rem; font-weight: 600; }
.smm-todo-detail { font-size: .78rem; color: var(--text-soft, #6E6E73); }

/* Zone 2 — l'évolution de Loïc */
.smm-week-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.smm-week {
  display: grid;
  gap: 6px;
  padding: 14px;
  border: 1px solid var(--surface-3, #E5E5EA);
  border-radius: var(--r-md, 12px);
  background: var(--surface, #FFF);
}
.smm-week.is-current { border-color: var(--accent, #0071E3); box-shadow: inset 0 0 0 1px var(--accent, #0071E3); }
.smm-week-label { margin: 0; font-size: .82rem; font-weight: 700; }
.smm-week-period { margin: 0; font-size: .72rem; color: var(--text-soft, #6E6E73); }
.smm-week-main { margin: 6px 0 0; display: flex; align-items: baseline; gap: 6px; }
.smm-week-main strong { font-size: 1.8rem; line-height: 1; }
.smm-week-main.is-bad strong { color: #D70015; }
.smm-week-main span { font-size: .78rem; color: var(--text-soft, #6E6E73); }
.smm-week-list { margin: 4px 0 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.smm-week-list li { font-size: .78rem; color: var(--text-soft, #6E6E73); }
.smm-week-list b { color: var(--text, #1D1D1F); }
.smm-trend { font-size: .8rem; font-weight: 600; }
.smm-trend.is-bad { color: #D70015; }
.smm-trend.is-good { color: #1E7A34; }

/* Zone 3 — l'encodage */
.smm-enc-lead { margin: 0; font-size: .9rem; }
.smm-enc-lead strong { font-size: 1.3rem; color: var(--accent, #0071E3); }
.smm-enc-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.smm-enc-week {
  display: grid;
  gap: 6px;
  padding: 12px 14px;
  border: 1px solid var(--surface-3, #E5E5EA);
  border-radius: var(--r-md, 12px);
  background: var(--surface, #FFF);
}
.smm-enc-bar { height: 8px; border-radius: 999px; background: var(--surface-3, #E5E5EA); overflow: hidden; }
.smm-enc-bar span { display: block; height: 100%; background: var(--accent, #0071E3); }
.smm-enc-figures { margin: 0; font-size: .78rem; color: var(--text-soft, #6E6E73); }
.smm-enc-figures b { color: var(--text, #1D1D1F); }
.smm-enc-figures em { color: #D70015; font-style: normal; font-weight: 600; }

/* Un liseré par zone : l'œil distingue « ce qui m'attend » (bleu, à traiter),
   « Loïc » (ambre, à surveiller), « ce que je lui demande » (bleu clair) et
   « l'encodage » (vert, un flux qui doit s'écouler). C'est la hiérarchie que
   l'ancien cockpit n'avait pas — treize blocs de même poids. */
.smm-zone { border-left: 3px solid var(--surface-3, #E5E5EA); }
.smm-zone-moi { border-left-color: var(--accent, #0071E3); }
.smm-zone-loic { border-left-color: #FF9F0A; }
.smm-zone-priorites { border-left-color: rgba(0,113,227,.45); }
.smm-zone-encodage { border-left-color: #34C759; }

/* Questionnaire du premier appel, sous la carte d'un candidat (2026-07-30) */
.rh-call { margin-top: 4px; border-top: 1px solid var(--surface-3, #E5E5EA); padding-top: 10px; }
.rh-call > summary { cursor: pointer; font-size: .84rem; font-weight: 600; color: var(--text, #1D1D1F); }
.rh-call-count {
  margin-left: 6px;
  border-radius: var(--r-full, 999px);
  padding: 1px 8px;
  font-size: .72rem;
  background: var(--surface-2, #F2F2F7);
  color: var(--text-soft, #6E6E73);
}
.rh-call-lead { margin: 8px 0 10px; font-size: .78rem; color: var(--text-soft, #6E6E73); }
.rh-call-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.rh-call-field { display: grid; gap: 4px; }
.rh-call-field > span { font-size: .78rem; font-weight: 600; color: var(--text-soft, #6E6E73); }
.rh-call-field input, .rh-call-field textarea {
  width: 100%;
  border: 1px solid var(--surface-3, #E5E5EA);
  border-radius: var(--r-sm, 8px);
  padding: 7px 10px;
  font-size: .85rem;
  font-family: inherit;
  background: var(--surface, #FFF);
  color: var(--text, #1D1D1F);
}
.rh-call-field input:focus, .rh-call-field textarea:focus { outline: 2px solid var(--accent, #0071E3); outline-offset: 1px; }
.rh-call-field .is-ok { border-color: #34C759; }
.rh-call-field .is-ko { border-color: #D70015; background: rgba(215,0,21,.06); }

/* Annonces générées : une tuile par annonce (2026-07-30). Le texte complet
   se déplie dans la tuile — empilé en pleine largeur, il fallait faire
   défiler la page pour découvrir qu'il en existait plusieurs. */
.rh-offer-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.rh-offer-tile {
  display: grid;
  gap: 4px;
  align-content: start;
  padding: 14px 16px;
  border: 1px solid var(--surface-3, #E5E5EA);
  border-radius: var(--r-md, 12px);
  background: var(--surface, #FFF);
}
.rh-offer-tile h4 { margin: 0; font-size: .96rem; }
.rh-offer-kind {
  margin: 0;
  align-self: start;
  border-radius: var(--r-full, 999px);
  padding: 2px 10px;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  background: var(--surface-2, #F2F2F7);
  color: var(--text-soft, #6E6E73);
}
.rh-offer-meta { margin: 0; font-size: .74rem; color: var(--text-soft, #6E6E73); }
.rh-offer-preview { margin: 4px 0 0; font-size: .82rem; color: var(--text-soft, #6E6E73); }
.rh-offer-full summary { cursor: pointer; font-size: .8rem; font-weight: 600; color: var(--accent, #0071E3); }
.rh-offer-full pre {
  margin: 8px 0 0;
  max-height: 320px;
  overflow: auto;
  white-space: pre-wrap;
  font-size: .78rem;
  background: var(--surface-2, #F2F2F7);
  border-radius: var(--r-sm, 8px);
  padding: 10px;
}

/* Qui est connecté — en-tête de l'Historique (2026-07-30). Pastille verte si
   la personne a ouvert une page dans le dernier quart d'heure ET garde une
   session ouverte ; rouge sinon, avec la date du dernier passage. */
.presence-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.presence-card {
  display: grid;
  gap: 2px;
  align-content: start;
  padding: 12px 14px;
  border: 1px solid var(--surface-3, #E5E5EA);
  border-radius: var(--r-md, 12px);
  background: var(--surface, #FFF);
}
.presence-card.is-online { border-color: rgba(52,199,89,.45); background: var(--green-soft, rgba(52,199,89,.10)); }
.presence-head { margin: 0; display: flex; align-items: center; gap: 8px; }
.presence-head strong { font-size: .93rem; }
.presence-dot {
  flex: none;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--coral, #FF3B30);
  box-shadow: 0 0 0 3px var(--coral-soft, rgba(255,59,48,.10));
}
.presence-card.is-online .presence-dot { background: var(--green, #34C759); box-shadow: 0 0 0 3px rgba(52,199,89,.20); }
.presence-role { margin: 0; font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--text-soft, #6E6E73); }
.presence-state { margin: 4px 0 0; font-size: .82rem; font-weight: 600; color: var(--coral-text, #C2342B); }
.presence-card.is-online .presence-state { color: var(--green-text, #15803D); }
.presence-when { margin: 0; font-size: .78rem; color: var(--text-soft, #6E6E73); }

/* Avertissements officiels (RH, 2026-07-30). Rédaction, historique par
   personne, et la carte que le technicien voit dans son espace. */
.rh-warning-form { display: grid; gap: 12px; }
.rh-warning-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.rh-warning-form label { display: grid; gap: 4px; font-size: .82rem; font-weight: 600; color: var(--text-soft, #6E6E73); }
.rh-warning-form textarea, .rh-warning-form select, .rh-warning-form input { font: inherit; font-weight: 400; }
.rh-warning-form-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.rh-warning-fixed { margin: 0; align-self: end; font-size: .9rem; }
.rh-warning-person { display: grid; gap: 8px; margin-bottom: 18px; }
.rh-warning-person-head { display: flex; align-items: center; gap: 10px; margin: 0 0 2px; font-size: .95rem; }
.rh-warning-count, .rh-warning-repeat {
  border-radius: var(--r-full, 999px);
  padding: 2px 10px;
  font-size: .72rem;
  font-weight: 700;
  background: var(--surface-2, #F2F2F7);
  color: var(--text-soft, #6E6E73);
}
.rh-warning-repeat { background: var(--coral-soft, rgba(255,59,48,.10)); color: var(--coral-text, #C2342B); }
.rh-warning-card {
  display: grid;
  gap: 6px;
  padding: 14px 16px;
  border: 1px solid var(--surface-3, #E5E5EA);
  border-left: 4px solid var(--surface-3, #E5E5EA);
  border-radius: var(--r-md, 12px);
  background: var(--surface, #FFF);
}
.rh-warning-card.is-draft { border-left-color: var(--gold, #FF9F0A); }
.rh-warning-card.is-waiting { border-left-color: var(--blue, #0071E3); }
.rh-warning-card.is-signed { border-left-color: var(--green, #34C759); }
.rh-warning-card.is-refused { border-left-color: var(--coral, #FF3B30); }
.rh-warning-head { display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; justify-content: space-between; margin: 0; }
.rh-warning-level {
  display: inline-block;
  margin-right: 8px;
  border-radius: var(--r-full, 999px);
  padding: 2px 10px;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  background: var(--blue-soft, rgba(0,113,227,.10));
  color: var(--blue, #0071E3);
}
.rh-warning-level.is-last { background: var(--coral-soft, rgba(255,59,48,.10)); color: var(--coral-text, #C2342B); }
.rh-warning-status { font-size: .78rem; font-weight: 600; color: var(--text-soft, #6E6E73); }
.rh-warning-meta { margin: 0; font-size: .76rem; color: var(--text-soft, #6E6E73); }
.rh-warning-facts { margin: 4px 0 0; font-size: .87rem; }
.rh-warning-response { margin: 2px 0 0; font-size: .82rem; color: var(--text-soft, #6E6E73); }
.rh-warning-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.rh-tag.is-warning { background: var(--gold-soft, rgba(255,159,10,.10)); color: var(--gold-text, #B45309); text-decoration: none; }
.rh-tag.is-warning.is-alert { background: var(--coral-soft, rgba(255,59,48,.10)); color: var(--coral-text, #C2342B); }

.terrain-warnings { display: grid; gap: 10px; margin-bottom: 16px; }
.terrain-warning {
  display: grid;
  gap: 6px;
  padding: 14px;
  border-radius: var(--r-md, 12px);
  border: 1px solid rgba(255,159,10,.45);
  background: rgba(255,159,10,.08);
}
.terrain-warning.is-done { border-color: rgba(52,199,89,.40); background: rgba(52,199,89,.08); }
.terrain-warning-head { display: grid; gap: 2px; }
.terrain-warning-head span { font-size: .76rem; opacity: .75; }
.terrain-warning-facts { margin: 0; font-size: .88rem; }
.terrain-warning-hint { margin: 0; font-size: .76rem; opacity: .75; }
.terrain-warning-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.terrain-warning-state { font-size: .85rem; font-weight: 600; }

/* Retrait d'une priorité par le SMM (2026-07-30) : motif dans la barre, pour
   que « Retirer » ne soit jamais un clic sans explication, et repli des
   priorités retirées — rien ne quitte définitivement la plateforme. */
.priority-remove-form { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.priority-remove-form input[type="text"] { width: auto; min-width: 150px; padding: 6px 10px; font-size: .78rem; }
.priority-archived-list { display: grid; gap: 8px; }
.priority-archived {
  display: grid;
  gap: 2px;
  padding: 10px 12px;
  border-radius: var(--r-md, 12px);
  border: 1px dashed var(--surface-3, #E5E5EA);
  background: var(--surface-2, #F2F2F7);
}
.priority-archived strong { font-size: .88rem; }
.priority-archived span { font-size: .76rem; color: var(--text-soft, #6E6E73); }
.priority-close-note { margin: 4px 0 0; font-size: .78rem; color: var(--green-text, #15803D); }

/* Relances : envoi WhatsApp en un geste (2026-07-30). Le lien ouvre la
   conversation avec le message prêt ; l'envoi reste validé à la main. */
.enc-relance-send { text-decoration: none; }
.enc-relance-nosend { font-size: .8rem; color: var(--coral-text, #C2342B); }
.enc-relance-done { font-size: .8rem; font-weight: 600; color: var(--green-text, #15803D); }
.enc-relance-item.is-sent { opacity: .62; }
.enc-relance-item.is-sent .enc-relance-send { background: var(--surface-3, #E5E5EA); color: var(--text-soft, #6E6E73); }
.enc-relance-howto.is-warning {
  border-left: 3px solid var(--gold, #FF9F0A);
  padding-left: 10px;
  color: var(--gold-text, #B45309);
}
.enc-relance-dial { display: block; font-size: .78rem; font-weight: 700; color: var(--accent, #0071E3); }

/* Semaine de chacun sur la plateforme (2026-07-30) : par jour, le temps compté
   actif puis la première et la dernière trace. */
.wk-table th, .wk-table td { text-align: center; vertical-align: middle; }
.wk-table thead th span { display: block; font-size: .78rem; }
.wk-table thead th small { display: block; font-weight: 400; opacity: .6; font-size: .68rem; }
.wk-table tbody th[scope="row"] { text-align: left; white-space: nowrap; }
.wk-table tbody th small { display: block; font-size: .68rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--text-soft, #6E6E73); }
.wk-cell strong { display: block; font-size: .88rem; }
.wk-cell span { display: block; font-size: .72rem; color: var(--text-soft, #6E6E73); }
.wk-cell.is-empty { color: var(--text-soft, #6E6E73); }
.wk-cell.is-approx strong { color: var(--text-soft, #6E6E73); font-weight: 600; }
.wk-approx { cursor: help; opacity: .7; }
.wk-total { font-weight: 700; }
.wk-weekend {
  display: inline-block;
  margin-top: 3px;
  border-radius: var(--r-full, 999px);
  padding: 1px 8px;
  font-size: .68rem;
  font-weight: 700;
  background: var(--gold-soft, rgba(255,159,10,.10));
  color: var(--gold-text, #B45309);
}

/* Cockpit dédoublé (étape 6b, 2026-07-30) : un bloc d'évolution par commercial,
   côte à côte sur grand écran, empilés sur petit. */
.smm-evo-grid { display: grid; gap: 14px; }
.smm-evo-grid.is-duo { grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); }
.smm-evo {
  border: 1px solid var(--surface-3, #E5E5EA);
  border-radius: var(--r-md, 12px);
  padding: 12px 14px;
  background: var(--surface, #FFF);
}
.smm-evo .panel-header.compact { margin-bottom: 8px; }
.smm-evo-grid.is-duo .smm-week-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.smm-evo-grid.is-duo .smm-week { padding: 8px 9px; }
.smm-evo-grid.is-duo .smm-week-period { font-size: .64rem; }
.smm-evo-grid.is-duo .smm-week-list { font-size: .72rem; }
.eval-history-who { display: block; font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--text-soft, #6E6E73); }

/* Confier des fiches à un commercial (étape 7, 2026-07-30). Replié : il ne
   sert que ponctuellement — surtout le jour où ASDIN reprend les dormants. */
.smm-confier > summary { cursor: pointer; display: flex; align-items: baseline; gap: 10px; list-style: none; }
.smm-confier > summary::-webkit-details-marker { display: none; }
.smm-confier > summary strong { font-size: 1.02rem; }
.smm-confier-head { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin-bottom: 10px; }
.smm-confier-head label { display: grid; gap: 4px; font-size: .78rem; font-weight: 600; color: var(--text-soft, #6E6E73); }
.smm-confier-list { display: grid; gap: 2px; max-height: 340px; overflow: auto; border: 1px solid var(--surface-3, #E5E5EA); border-radius: var(--r-md, 12px); padding: 6px; }
.smm-confier-row { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 5px 8px; border-radius: var(--r-sm, 8px); cursor: pointer; }
.smm-confier-row:hover { background: var(--surface-2, #F2F2F7); }
.smm-confier-nom { font-size: .88rem; font-weight: 600; }
.smm-confier-meta { font-size: .74rem; color: var(--text-soft, #6E6E73); text-align: right; }

/* Reprise PRIORITAIRE (2026-07-30) : un dossier confié « chaud » se reconnaît
   d'un coup d'œil dans le pipeline, et remonte en tête de la file d'appel. */
.crm-chip.is-priority { background: var(--accent-warm-soft, #FFF1E3); color: var(--accent-warm, #C2560A); font-weight: 700; }
.smm-confier-prio { display: flex; align-items: center; gap: 6px; font-weight: 600; cursor: pointer; }
.smm-confier-prio input { margin: 0; }
.crm-lead-title { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* Mot d'accueil du lanceur (2026-07-31) : une phrase centrée au-dessus des
   tuiles, qui salue par le prénom — le clin d'œil à l'accueil de Claude. */
.apps-home { width: 100%; max-width: 920px; display: grid; gap: 34px; justify-items: center; }
.apps-greeting { font-family: ui-serif, Georgia, "Times New Roman", serif; font-size: clamp(1.45rem, 3.2vw, 2.05rem); color: var(--text); text-align: center; margin: 2vh 0 0; letter-spacing: .01em; animation: apps-greeting-in .7s ease both; }
@keyframes apps-greeting-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .apps-greeting { animation: none; } }

/* Avertissement au portail : document COMPLET, par sections (revue 30/07) —
   un texte disciplinaire tronqué ne vaut rien le jour où il compte. */
.terrain-warning-section { display: grid; gap: 4px; margin-bottom: 10px; }
.terrain-warning-section > strong { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; opacity: .75; }
.terrain-warning-facts { white-space: pre-line; overflow-wrap: anywhere; }

/* Zone de dépôt du CV sur la carte de candidature (2026-08-03). */
.rh-appli-drop { border: 1.5px dashed var(--border, #C7C7CC); border-radius: var(--r-md, 12px); padding: 9px 12px; font-size: .8rem; color: var(--text-soft, #6E6E73); cursor: pointer; text-align: center; transition: border-color .15s ease, background .15s ease; }
.rh-appli-drop.is-dragover { border-color: var(--accent, #0a5dc2); background: var(--accent-soft, #EAF2FD); color: var(--accent, #0a5dc2); }
.rh-appli-drop.is-busy { opacity: .7; pointer-events: none; }
.rh-appli-drop.is-done { border-style: solid; border-color: var(--ok, #1a8a3c); color: var(--ok, #1a8a3c); }
.rh-appli-drop.is-error { border-color: var(--danger, #cc3344); color: var(--danger, #cc3344); }

/* « Apprendre de nos erreurs » — encart du lanceur (2026-08-03). Sobre : une
   carte claire sous la grille, un champ, un conseil. */
.lessons-card { width: 100%; max-width: 720px; background: var(--surface, #fff); border: 1px solid var(--border, #E5E5EA); border-radius: 20px; box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,.08)); padding: 22px 24px; display: grid; gap: 14px; margin-top: 4vh; }
.lessons-head { display: flex; gap: 12px; align-items: flex-start; }
.lessons-icon { font-size: 1.5rem; line-height: 1; margin-top: 2px; }
.lessons-head h2 { font-size: 1.05rem; margin: 0 0 2px; }
.lessons-head p { font-size: .82rem; color: var(--text-soft, #6E6E73); margin: 0; }
.lessons-form { display: grid; gap: 10px; }
.lessons-form textarea { resize: vertical; min-height: 52px; border: 1px solid var(--border, #C7C7CC); border-radius: 12px; padding: 10px 12px; font: inherit; }
.lessons-form .primary-button { justify-self: end; }
.lesson-offline { font-size: .78rem; color: var(--warn, #b45309); background: var(--warn-soft, #FFF7E6); border-radius: 10px; padding: 8px 12px; margin: 0; }
.lesson-item { border: 1px solid var(--border, #E5E5EA); border-radius: 14px; padding: 12px 14px; display: grid; gap: 6px; background: var(--surface, #fff); }
.lesson-item--fresh { border-color: var(--accent, #0a5dc2); animation: apps-greeting-in .5s ease both; }
.lesson-item-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.lesson-item-head small { color: var(--text-soft, #6E6E73); font-size: .74rem; }
.lesson-chip { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 3px 9px; border-radius: 999px; background: var(--surface-2, #F2F2F7); color: var(--text-soft, #55606e); }
.lesson-chip--relationnel { background: #FDEBF3; color: #be185d; }
.lesson-chip--humain { background: #EFEAFD; color: #7048c9; }
.lesson-chip--client { background: #EAF2FD; color: #0a5dc2; }
.lesson-chip--chantier { background: #FFF1E3; color: #C2560A; }
.lesson-chip--organisation { background: #E6F6EC; color: #1a8a3c; }
.lesson-mistake { font-size: .86rem; margin: 0; }
.lesson-advice { font-size: .84rem; margin: 0; padding: 9px 12px; border-radius: 10px; background: var(--accent-soft, #EAF2FD); color: var(--text, #1D1D1F); white-space: pre-line; }
.lesson-history summary { cursor: pointer; font-size: .84rem; font-weight: 600; color: var(--text-soft, #6E6E73); }
.lesson-count { background: var(--surface-2, #F2F2F7); border-radius: 999px; padding: 1px 8px; font-size: .74rem; margin-left: 4px; }
.lesson-list { display: grid; gap: 10px; margin-top: 10px; }
.lesson-fresh { display: grid; gap: 10px; }
.lesson-deferred { font-size: .78rem; color: var(--text-soft, #6E6E73); background: var(--surface-2, #F2F2F7); border-radius: 10px; padding: 8px 12px; margin: 0; }
.lesson-pending { font-size: .8rem; color: var(--text-soft, #6E6E73); font-style: italic; margin: 0; }

/* Ajout manuel aux disponibles (2026-08-03). */
.pg-avail-add { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--border, #E5E5EA); font-size: .82rem; }
.pg-avail-add input[type="text"] { min-width: 180px; padding: 6px 10px; border: 1px solid var(--border, #C7C7CC); border-radius: 8px; font: inherit; }
.pg-avail-add input[type="date"] { padding: 6px 8px; border: 1px solid var(--border, #C7C7CC); border-radius: 8px; font: inherit; }
.pg-avail-chip.is-manual { background: var(--accent-soft, #EAF2FD); border-color: var(--accent, #0a5dc2); }
.lesson-deferred.is-soon { color: var(--accent, #0a5dc2); background: var(--accent-soft, #EAF2FD); }
.lesson-deferred.is-late { color: var(--warn, #b45309); background: var(--warn-soft, #FFF7E6); }