/* ==========================================================================
   GESTION FONCIÈRE ÉOLIENNE — V2 DESIGN SYSTEM
   --------------------------------------------------------------------------
   Refonte complète après audit (10 800 lignes legacy → version propre).
   Backup ancien fichier : css/style-legacy.css
   --------------------------------------------------------------------------
   Principes :
   - 0 dépendance externe
   - Tokens design system (light + dark)
   - Pas de !important sauf overrides Leaflet
   - Mode sombre véritable (vrai noir, accents vert vif)
   - Style "Terminal Pro" : labels uppercase + mono, KPI sobres
   - IDs HTML et classes JS strictement préservés
   --------------------------------------------------------------------------
   Sommaire :
   1. Tokens (variables design system)
   2. Reset & base
   3. Typographie
   4. Layout (topbar, sidebar, content, theme toggle)
   5. Components (buttons, inputs, cards, badges, pills, forms)
   6. Module : Projects (liste accueil)
   7. Module : Dashboard (widgets)
   8. Module : Contracts (liste + fiche latérale)
   9. Module : Owners (propriétaires / exploitants)
   10. Module : Map (Leaflet + filtres + mesures)
   11. Module : Reminders
   12. Module : Townhall (mairies)
   13. Module : Weather (météo)
   14. Module : Watch (veille)
   15. Module : Admin (import)
   16. Module : History
   17. Utilities & responsive
   ========================================================================== */


/* ==========================================================================
   1. TOKENS — Design system
   ========================================================================== */

:root {
  /* === SURFACES (light — terminal financier propre) === */
  --bg: #f9fafb;
  --bg-soft: #f4f6f7;
  --panel: #ffffff;
  --panel-soft: #f5f7f8;
  --panel-elevated: #ffffff;

  /* === TEXTES === */
  --text: #15191c;
  --text-strong: #000000;
  --text-secondary: #6f7b7d;
  --text-muted: #6f7b7d;
  --text-subtle: #9aa4a6;
  --muted: #6f7b7d;

  /* === BORDURES (visibles, style "fil technique") === */
  --border: #e4eaeb;
  --border-soft: #eef1f2;
  --border-strong: #cfd6d7;

  /* === OMBRES (quasi nulles) === */
  --shadow-sm: 0 1px 0 rgba(0, 0, 0, .02);
  --shadow-md: 0 1px 2px rgba(0, 0, 0, .03);
  --shadow-lg: 0 2px 6px rgba(0, 0, 0, .05);

  /* === ACCENT PRINCIPAL : MENTHE === */
  --accent: #5fcfbe;
  --accent-hover: #4dbdac;
  --accent-dark: #2aa896;
  --accent-soft: #dff6f2;
  --accent-bright: #2aa896;
  --accent-on: #0f1f1c;

  /* === ACCENT SECONDAIRE : CUIVRE (warning + finance) === */
  --warning: #c47a3b;
  --warning-soft: #f3e5d7;
  --warning-strong: #a05f25;

  /* === COULEURS PAR MODULE (harmonisées : 2 teintes principales + variants neutres) === */
  --module-contracts: #2aa896;     /* Menthe accent strong */
  --module-financial: #c47a3b;     /* Cuivre */
  --module-map: #5b7a8a;           /* Bleu acier neutre */
  --module-reminders: #8b6db5;     /* Violet désaturé */
  --module-mayor: #5fcfbe;         /* Menthe (accent) */
  --module-watch: #6f7b7d;         /* Gris-bleu neutre */
  --module-weather: #5fcfbe;       /* Menthe (accent) */

  /* === STATUTS (palette harmonisée menthe/cuivre) === */
  --status-non-contacte: #9aa4a6;
  --status-contacte: #c47a3b;
  --status-signature: #8b6db5;
  --status-signe: #4fbf9f;
  --status-refus: #d46a6a;

  /* === ALIASES STATUTS pour le JS (cssVar lit avec underscore !) === */
  --non_contacte: #9aa4a6;
  --contacte: #c47a3b;
  --signature: #8b6db5;
  --signe: #4fbf9f;
  --refus: #d46a6a;
  --sans_contrat: #9aa4a6;
  --courrier: #5b7a8a;
  --negociation: #c47a3b;

  /* === SÉMANTIQUE === */
  --success: #4fbf9f;
  --danger: #d46a6a;
  --info: #5b7a8a;

  /* === TYPOGRAPHIE — Mono dominant + sans-serif pour contenu narratif === */
  --font-base: "JetBrains Mono", "IBM Plex Mono", "SF Mono", "Cascadia Code", Consolas, "Courier New", monospace;
  --font-mono: "JetBrains Mono", "IBM Plex Mono", "SF Mono", "Cascadia Code", Consolas, "Courier New", monospace;
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --fs-xs: 10px;
  --fs-sm: 12px;
  --fs-base: 13px;
  --fs-md: 14px;
  --fs-lg: 16px;
  --fs-xl: 20px;
  --fs-2xl: 26px;
  --fs-kpi: 34px;

  /* === SPACING === */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;

  /* === RADIUS (très faible, style terminal carré) === */
  --r-sm: 2px;
  --r-md: 3px;
  --r-lg: 4px;
  --r-xl: 6px;
  --r-2xl: 8px;

  /* === TRANSITIONS === */
  --t-fast: 120ms ease;
  --t: 160ms ease;
  --t-slow: 280ms cubic-bezier(.4, 0, .2, 1);

  /* === FOCUS === */
  --focus-ring: 0 0 0 3px rgba(45, 122, 95, .25);

  /* === LAYOUT === */
  --topbar-h: 64px;
  --sidebar-w: 260px;
  --content-max: 1760px;
}

/* === DARK THEME — Terminal financier (noir chaud cuivré + menthe) === */
html[data-theme="dark"] {
  /* Surfaces (noir chaud légèrement cuivré, distinctif vs noir pur) */
  --bg: #120f0d;
  --bg-soft: #171310;
  --panel: #15110f;
  --panel-soft: #1d1815;
  --panel-elevated: #221c18;

  /* Textes (blanc chaud, hiérarchie nette) */
  --text: #f4f1ed;
  --text-strong: #ffffff;
  --text-secondary: #9b938b;
  --text-muted: #9b938b;
  --text-subtle: #625b55;
  --muted: #9b938b;

  /* Bordures visibles mais discrètes (style "fil") */
  --border: #2b2520;
  --border-soft: #221d19;
  --border-strong: #3c332c;

  /* Ombres */
  --shadow-sm: 0 1px 0 rgba(0, 0, 0, .3);
  --shadow-md: 0 1px 2px rgba(0, 0, 0, .4);
  --shadow-lg: 0 2px 6px rgba(0, 0, 0, .5);

  /* Accent principal : MENTHE (signature visuelle) */
  --accent: #6fd8c9;
  --accent-hover: #82ded2;
  --accent-dark: #9ce9de;
  --accent-soft: #183c37;
  --accent-bright: #9ce9de;
  --accent-on: #120f0d;

  /* Accent secondaire : CUIVRE */
  --warning: #b67837;
  --warning-soft: #3a2616;
  --warning-strong: #d49858;

  /* Modules adaptés sombre (palette restreinte, harmonisée) */
  --module-contracts: #6fd8c9;     /* Menthe */
  --module-financial: #b67837;     /* Cuivre */
  --module-map: #7d99a8;           /* Bleu acier doux */
  --module-reminders: #a995cc;     /* Violet désaturé */
  --module-mayor: #6fd8c9;         /* Menthe */
  --module-watch: #9b938b;         /* Gris-text-secondaire */
  --module-weather: #6fd8c9;       /* Menthe */

  /* Statuts (noms cohérents avec l'image) */
  --status-non-contacte: #625b55;
  --status-contacte: #b67837;
  --status-signature: #a995cc;
  --status-signe: #65caa8;
  --status-refus: #d16a6a;
  --sans_contrat: #625b55;

  /* Sémantique */
  --success: #65caa8;
  --danger: #d16a6a;
  --info: #7d99a8;

  /* Focus (menthe) */
  --focus-ring: 0 0 0 2px rgba(111, 216, 201, .35);
}


/* ==========================================================================
   2. RESET & BASE
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--font-base);
  background: var(--bg);
  color: var(--text);
  font-size: var(--fs-base);
  line-height: 1.5;
  transition: background-color 200ms ease, color 200ms ease;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "tnum" 1, "ss01" 1;
}

/* === Contenu narratif (paragraphes longs, noms propres, descriptions) en sans-serif
   pour préserver la lisibilité. Le mono reste dominant pour labels/valeurs/structure. */
.contact-line,
.note p,
.signataire-card p,
.contact-card p,
textarea,
.import-result,
.history-card .history-detail,
.watch-result-excerpt {
  font-family: var(--font-sans);
}

/* Inputs textuels en sans-serif (lecture longue) */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
textarea,
select {
  font-family: var(--font-sans);
}

/* Inputs numériques restent monospace */
input[type="number"],
input[type="date"],
input[type="time"],
input[type="datetime-local"] {
  font-family: var(--font-mono);
}

img { display: block; max-width: 100%; }
/* SVG par défaut : pas de contraintes (sauf hors Leaflet/cartes).
   Leaflet positionne ses <svg> en absolute avec des tailles dynamiques —
   forcer display:block + max-width:100% les masque (parcelles, mesures, etc.) */
.leaflet-container svg,
.leaflet-pane svg {
  max-width: none;
  max-height: none;
  display: block;
}

a {
  color: var(--accent);
  text-decoration: none;
  transition: color var(--t-fast);
}
a:hover { color: var(--accent-hover); text-decoration: underline; }


/* ==========================================================================
   3. TYPOGRAPHIE
   ========================================================================== */

h1, h2, h3, h4, h5, p { margin: 0; }

h1 {
  font-size: var(--fs-xl);
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--text-strong);
}
h2 {
  font-size: var(--fs-lg);
  font-weight: 600;
  color: var(--text-strong);
}
h3 {
  font-size: var(--fs-md);
  font-weight: 600;
  color: var(--text-strong);
}
h4 {
  font-size: var(--fs-base);
  font-weight: 600;
  color: var(--text);
}

p { color: var(--text); }

.subtitle {
  color: var(--text-muted);
  font-size: var(--fs-sm);
}
.meta {
  color: var(--text-muted);
  font-size: var(--fs-sm);
}
.muted { color: var(--text-muted); }

/* === Pattern label : "• MAJUSCULES MONOSPACE" === */
.gf-label,
.section-label,
.card-label {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--text-muted);
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
}
.gf-label::before,
.section-label::before,
.card-label::before {
  content: "•";
  color: var(--accent);
  font-size: 1.2em;
  line-height: 0;
}


/* ==========================================================================
   4. LAYOUT (topbar, sidebar, content, theme toggle)
   ========================================================================== */

/* === TOPBAR === */
.topbar {
  min-height: var(--topbar-h);
  padding: var(--sp-3) var(--sp-5);
  background: var(--panel);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-5);
  position: sticky;
  top: 0;
  z-index: 100;
}
.topbar > div:first-child { flex: 1; min-width: 0; }
.topbar h1 {
  font-family: var(--font-mono);
  font-size: var(--fs-md);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-strong);
}
.topbar h1::before {
  content: "•";
  color: var(--accent);
  margin-right: 0.5em;
}
.topbar .app-version {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--warning);
  font-weight: 400;
  margin-left: var(--sp-3);
  letter-spacing: 0.04em;
}
.topbar .subtitle {
  margin-top: var(--sp-1);
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.sync-box {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  flex-wrap: wrap;
}
.user {
  color: var(--text-secondary);
  font-size: var(--fs-sm);
  font-weight: 500;
}

/* === THEME TOGGLE === */
.theme-toggle {
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: 999px;
  width: 50px;
  height: 28px;
  padding: 2px;
  cursor: pointer;
  position: relative;
  transition: var(--t);
}
.theme-toggle:hover {
  border-color: var(--accent);
}
.theme-toggle .toggle-inner {
  width: 24px;
  height: 24px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 2px;
  top: 1px;
  color: var(--text);
  transition: var(--t);
}
html[data-theme="dark"] .theme-toggle .toggle-inner {
  left: 24px;
  background: var(--panel-elevated);
  color: var(--accent);
}
.theme-toggle .toggle-inner svg {
  width: 14px;
  height: 14px;
}

/* === LAYOUT GRID (sidebar + content) === */
.layout {
  display: grid;
  grid-template-columns: var(--sidebar-w) minmax(0, 1fr);
  min-height: calc(100vh - var(--topbar-h));
}

/* === SIDEBAR === */
.sidebar {
  background: var(--panel);
  border-right: 1px solid var(--border);
  padding: var(--sp-4);
  overflow-y: auto;
  position: sticky;
  top: var(--topbar-h);
  max-height: calc(100vh - var(--topbar-h));
}

.nav-btn {
  display: block;
  width: 100%;
  padding: var(--sp-3) var(--sp-4);
  margin-bottom: var(--sp-2);
  border: 1px solid var(--border);
  background: var(--panel);
  color: var(--text);
  border-radius: var(--r-md);
  text-align: left;
  cursor: pointer;
  font-weight: 600;
  font-size: var(--fs-sm);
  transition: var(--t);
  font-family: inherit;
}
.nav-btn:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}
.nav-btn.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.project-menu {
  margin-top: var(--sp-3);
  padding-top: var(--sp-3);
  border-top: 1px solid var(--border);
}
.project-menu-title {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-muted);
  font-weight: 600;
  margin-bottom: var(--sp-2);
  padding: 0 var(--sp-2);
}
.project-menu-title::before {
  content: "• ";
  color: var(--accent);
}

.hidden { display: none !important; }

/* === DIAGNOSTIC BOX (sidebar) === */
.diagnostic {
  margin-top: var(--sp-5);
  padding: var(--sp-3);
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
}
.diagnostic h3 {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-muted);
  font-weight: 600;
  margin-bottom: var(--sp-2);
}
.diagnostic h3::before {
  content: "• ";
  color: var(--accent);
}
.diagnostic ul {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: var(--fs-xs);
  color: var(--text-muted);
}
.diagnostic li {
  padding: var(--sp-1) 0;
  padding-left: var(--sp-3);
  position: relative;
  line-height: 1.4;
}
.diagnostic li::before {
  content: "›";
  position: absolute;
  left: 0;
  color: var(--text-subtle);
}

/* === CONTENT === */
.content {
  padding: var(--sp-5);
  max-width: var(--content-max);
  margin: 0 auto;
  width: 100%;
}

.view {
  display: none;
  animation: fadeIn 200ms ease;
}
.view.active { display: block; }

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

.section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-4);
  margin-bottom: var(--sp-5);
  flex-wrap: wrap;
}
.section-head > div:first-child { min-width: 0; }
.section-head h2 { margin-bottom: var(--sp-1); }


/* ==========================================================================
   5. COMPONENTS (boutons, inputs, cards, badges, pills, forms)
   ========================================================================== */

/* === BUTTONS === */
button {
  font: inherit;
  font-weight: 600;
  font-size: var(--fs-sm);
  border: 1px solid var(--border);
  background: var(--panel);
  color: var(--text);
  padding: var(--sp-2) var(--sp-4);
  border-radius: var(--r-md);
  cursor: pointer;
  transition: var(--t);
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  line-height: 1.4;
}
button:hover:not(:disabled) {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}
button:active:not(:disabled) { transform: scale(.98); }
button:disabled { opacity: .5; cursor: not-allowed; }
button:focus-visible { outline: none; box-shadow: var(--focus-ring); }

button.primary,
.primary,
.primary-action {
  background: var(--accent);
  color: var(--accent-on);
  border-color: var(--accent);
}
button.primary:hover:not(:disabled),
.primary:hover:not(:disabled),
.primary-action:hover:not(:disabled) {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
  color: var(--accent-on);
}

button.danger,
.danger {
  color: var(--danger);
  border-color: var(--danger);
  background: transparent;
}
button.danger:hover:not(:disabled),
.danger:hover:not(:disabled) {
  background: var(--danger);
  color: white;
}

/* === INPUTS / SELECTS / TEXTAREAS === */
input,
select,
textarea {
  font: inherit;
  font-size: var(--fs-sm);
  border: 1px solid var(--border);
  background: var(--panel);
  color: var(--text);
  padding: var(--sp-2) var(--sp-3);
  border-radius: var(--r-md);
  transition: var(--t);
  font-family: inherit;
}
input::placeholder,
textarea::placeholder {
  color: var(--text-subtle);
}
input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: var(--focus-ring);
}

input[type="search"] {
  width: min(420px, 100%);
}

input[type="date"],
input[type="time"],
input[type="datetime-local"] {
  color-scheme: light;
}
html[data-theme="dark"] input[type="date"],
html[data-theme="dark"] input[type="time"],
html[data-theme="dark"] input[type="datetime-local"] {
  color-scheme: dark;
}

textarea {
  width: 100%;
  min-height: 80px;
  resize: vertical;
  line-height: 1.5;
}

input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--accent);
  cursor: pointer;
}

input[type="file"] {
  padding: var(--sp-2);
  background: var(--bg-soft);
  cursor: pointer;
}

label {
  font-size: var(--fs-sm);
  color: var(--text);
  display: inline-block;
}

/* === CARDS (générique) === */
.card,
.muted-box {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: var(--sp-5);
  box-shadow: var(--shadow-sm);
}
.cards {
  display: grid;
  gap: var(--sp-4);
}

/* === PILLS === */
.pill {
  display: inline-flex;
  align-items: center;
  padding: var(--sp-1) var(--sp-3);
  border-radius: 999px;
  font-size: var(--fs-xs);
  font-weight: 600;
  white-space: nowrap;
  font-family: var(--font-mono);
  letter-spacing: 0.04em;
}
.pill.ok       { background: rgba(46, 157, 91, .15); color: var(--success); }
.pill.warn     { background: rgba(224, 179, 65, .18); color: var(--warning); }
.pill.error    { background: rgba(201, 67, 67, .15); color: var(--danger); }
.pill.neutral  { background: var(--bg-soft); color: var(--text-secondary); }

/* === STATS / TAGS === */
.stat,
.parcel-tag {
  display: inline-flex;
  align-items: center;
  padding: var(--sp-1) var(--sp-2);
  border-radius: var(--r-sm);
  background: var(--bg-soft);
  color: var(--text-secondary);
  font-size: var(--fs-xs);
  font-weight: 500;
}
.stats {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2);
  margin-top: var(--sp-3);
}

/* === KPI tile (réutilisable) === */
.kpi-tile {
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-4);
  display: flex;
  flex-direction: column;
  gap: var(--sp-1);
}
.kpi-tile strong {
  font-size: var(--fs-xl);
  font-weight: 700;
  color: var(--text-strong);
  letter-spacing: -0.02em;
  line-height: 1.1;
}
.kpi-tile span {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
}

/* === PROGRESS BAR === */
.progress {
  height: 6px;
  border-radius: 999px;
  background: var(--bg-soft);
  overflow: hidden;
  margin: var(--sp-3) 0;
}
.progress span {
  display: block;
  height: 100%;
  background: var(--accent);
  border-radius: 999px;
  transition: width 300ms ease;
}

/* === SWATCH (carré coloré, utilisé dans filtres + légendes)
   Le JS y injecte un style="background: #..." inline. */
.swatch {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: var(--r-sm);
  border: 1px solid var(--border);
  flex-shrink: 0;
  vertical-align: middle;
}

/* === CHIPS DE STATUT FONCIER (Contrats & foncier widget)
   Le JS injecte style="--chip-color: #XXXXXX". */
.foncier-status-chip {
  --chip-color: var(--accent);
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-1) var(--sp-3);
  background: color-mix(in srgb, var(--chip-color) 10%, var(--panel-soft));
  border: 1px solid color-mix(in srgb, var(--chip-color) 25%, transparent);
  border-left: 3px solid var(--chip-color);
  border-radius: var(--r-md);
  font-size: var(--fs-xs);
  white-space: nowrap;
}
.foncier-status-chip .chip-icon {
  font-size: 14px;
  line-height: 1;
}
.foncier-status-chip strong {
  color: var(--chip-color);
  font-weight: 800;
  font-size: var(--fs-sm);
}
.foncier-status-chip span:last-child {
  color: var(--text-secondary);
}

/* === STATUTS COMPACTS (fiche propriétaire compacte)
   Le JS injecte style="--status-color: #XXXXXX". */
.owner-compact-statuses {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--sp-1);
}
.owner-compact-status {
  --status-color: var(--text-muted);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px var(--sp-2);
  border-radius: 999px;
  background: color-mix(in srgb, var(--status-color) 12%, transparent);
  color: var(--status-color);
  border: 1px solid color-mix(in srgb, var(--status-color) 30%, transparent);
  font-size: var(--fs-xs);
  font-weight: 600;
  font-family: var(--font-mono);
  letter-spacing: 0.04em;
  white-space: nowrap;
}
.owner-compact-status.empty {
  background: var(--bg-soft);
  color: var(--text-muted);
  border-color: var(--border);
}

/* === SCROLLBAR === */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover { background: var(--text-muted); }


/* ==========================================================================
   6. MODULE : PROJECTS (liste accueil)
   ========================================================================== */

.project-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: var(--sp-4);
}

.project-list-titlebar {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}

.project-list-titlebar h2 {
  align-self: flex-start;
}

.project-view-switch {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  width: fit-content;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--panel);
  box-shadow: var(--shadow-sm);
}

.project-view-btn {
  width: 30px;
  height: 28px;
  min-height: 28px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--text-secondary);
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--r-sm);
}

.project-view-btn:hover {
  color: var(--text-strong);
  border-color: var(--border-strong);
  background: var(--panel-elevated);
}

.project-view-btn.active {
  color: var(--accent);
  border-color: color-mix(in srgb, var(--accent) 42%, var(--border));
  background: color-mix(in srgb, var(--accent) 13%, transparent);
}

.project-row-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 100%;
}

.project-row {
  display: grid;
  grid-template-columns: 128px minmax(240px, 1fr) minmax(150px, 240px) 36px;
  gap: var(--sp-4);
  align-items: center;
  padding: var(--sp-3) var(--sp-4);
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  cursor: pointer;
  position: relative;
  width: 100%;
  transition: transform var(--t), border-color var(--t), background var(--t), box-shadow var(--t);
}

.project-row:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

.project-row.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  border-left: 3px solid var(--accent);
}

.project-row-code {
  width: fit-content;
  min-width: 82px;
  max-width: 100%;
  padding: 4px 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text-strong);
  background: color-mix(in srgb, var(--accent) 14%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent) 34%, var(--border));
  border-radius: var(--r-sm);
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .02em;
}

.project-row-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text-strong);
  font-size: var(--fs-sm);
  font-weight: 800;
  line-height: 1.25;
}

.project-row-manager {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text-muted);
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
}

.project-row-action {
  width: 30px;
  height: 30px;
  min-height: 30px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--text-secondary);
  background: var(--panel-elevated);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
}

.project-row-action:hover {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--accent-soft);
}

.project-row .project-admin-backdrop,
.project-row .project-admin-panel {
  grid-column: 1 / -1;
}

.project-card {
  --card-accent: var(--accent-dark);
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: var(--sp-5);
  cursor: pointer;
  transition: transform var(--t-slow), box-shadow var(--t-slow), border-color var(--t-slow);
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  will-change: transform;
  position: relative;
}
.project-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--card-accent);
  border-radius: var(--r-lg) var(--r-lg) 0 0;
  pointer-events: none;
  opacity: 0;
  transform: scaleX(0.6);
  transition: opacity var(--t-slow), transform var(--t-slow);
  z-index: 1;
}
.project-card:hover::before {
  opacity: 1;
  transform: scaleX(1);
}
.project-card h3 {
  margin-bottom: var(--sp-1);
  color: var(--text-strong);
}
.project-card .meta { color: var(--text-muted); }

.project-card .project-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--sp-2);
}
.project-card .project-card-code {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--accent);
  background: var(--accent-soft);
  padding: 2px var(--sp-2);
  border-radius: var(--r-sm);
}

/* Carte projet compacte : lecture directe au premier coup d'oeil */
.project-grid {
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 430px));
  align-items: stretch;
}

.project-card.project-card-clean {
  --project-progress: clamp(0%, calc(var(--pct, 0) * 1%), 100%);
  gap: 14px;
  min-height: 0;
  padding: 18px;
  border-radius: var(--r-xl);
  background: linear-gradient(180deg, color-mix(in srgb, var(--panel) 96%, var(--accent) 4%), var(--surface-card-soft, var(--panel-soft)));
  border-color: color-mix(in srgb, var(--border) 82%, var(--accent) 18%);
  box-shadow: var(--shadow-sm);
}

.project-card.project-card-clean:hover {
  background: linear-gradient(180deg, color-mix(in srgb, var(--panel) 92%, var(--accent) 8%), var(--surface-card-soft, var(--panel-soft)));
  border-color: color-mix(in srgb, var(--accent) 62%, var(--border));
  box-shadow: var(--shadow-md);
}

.project-clean-head,
.project-clean-footline {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.project-clean-title {
  min-width: 0;
}

.project-clean-kicker,
.project-clean-meta,
.project-card-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
}

.project-code-pill,
.project-status-pill,
.project-clean-meta span,
.project-clean-weather,
.project-manage-btn {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 3px 8px;
  line-height: 1;
  white-space: nowrap;
}

.project-code-pill {
  background: color-mix(in srgb, var(--accent) 17%, transparent);
  color: var(--text-strong);
  border-color: color-mix(in srgb, var(--accent) 38%, var(--border));
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .02em;
}

.project-status-pill {
  color: var(--warning);
  background: color-mix(in srgb, var(--warning) 10%, transparent);
  border-color: color-mix(in srgb, var(--warning) 30%, var(--border));
  font-size: 11px;
  font-weight: 750;
  text-transform: uppercase;
}

.project-card.project-card-clean h3 {
  margin: 8px 0 7px;
  color: var(--text-strong);
  font-family: var(--font-sans);
  font-size: 18px;
  font-weight: 850;
  line-height: 1.12;
  letter-spacing: 0;
  text-transform: none;
}

.project-clean-meta span {
  color: var(--text-secondary);
  background: color-mix(in srgb, var(--panel) 55%, transparent);
  font-size: 11.5px;
  font-weight: 700;
}

.project-card-actions {
  justify-content: flex-end;
  flex-shrink: 0;
}

.project-clean-weather {
  color: var(--text-strong);
  background: color-mix(in srgb, var(--module-weather) 12%, transparent);
  border-color: color-mix(in srgb, var(--module-weather) 30%, var(--border));
  font-size: 12px;
  font-weight: 850;
}

.project-clean-weather .weather-mark {
  font-size: 14px;
  line-height: 1;
}

.project-manage-btn {
  color: var(--text);
  background: var(--panel-elevated);
  border-color: var(--border-strong);
  font-size: 11.5px;
  font-weight: 800;
  cursor: pointer;
}

.project-clean-main {
  display: grid;
  gap: 12px;
}

.project-progress-block {
  --project-progress: clamp(0%, calc(var(--pct, 0) * 1%), 100%);
  padding: 12px;
  border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--border));
  border-radius: var(--r-lg);
  background: color-mix(in srgb, var(--accent) 7%, transparent);
}

.project-progress-top,
.project-progress-bottom {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}

.project-progress-top span {
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.project-progress-top strong {
  color: var(--accent);
  font-family: var(--font-mono);
  font-size: 24px;
  font-weight: 900;
}

.project-progress-track {
  height: 9px;
  margin: 10px 0 9px;
  overflow: hidden;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border-strong) 58%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--border-strong) 50%, transparent);
}

.project-progress-track span {
  display: block;
  width: var(--project-progress);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--accent-dark), var(--accent));
}

.project-progress-bottom strong,
.project-progress-bottom span {
  font-size: 12px;
}

.project-progress-bottom strong {
  color: var(--text-strong);
  font-weight: 850;
}

.project-progress-bottom span {
  color: var(--text-secondary);
  text-align: right;
}

.project-clean-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.project-card-clean .clean-kpi {
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: color-mix(in srgb, var(--panel) 62%, transparent);
}

.project-card-clean .clean-kpi-label {
  display: block;
  margin-bottom: 7px;
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .06em;
  line-height: 1;
  text-transform: uppercase;
}

.project-card-clean .clean-kpi strong {
  display: block;
  color: var(--text-strong);
  font-family: var(--font-mono);
  font-size: 15px;
  font-weight: 900;
  line-height: 1.15;
}

.project-card-clean .clean-kpi span:not(.clean-kpi-label) {
  display: block;
  margin-top: 4px;
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 650;
  line-height: 1.25;
}

.project-clean-footer {
  display: grid;
  gap: 10px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}

.project-clean-reminder {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: baseline;
  gap: 6px 10px;
}

.project-clean-reminder strong {
  color: var(--text-strong);
  font-size: 12px;
  font-weight: 850;
}

.project-clean-reminder span,
.project-clean-reminder em,
.project-clean-weather-line {
  color: var(--text-secondary);
  font-size: 12px;
  font-style: normal;
  font-weight: 650;
}

.project-clean-reminder em {
  grid-column: 2;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-clean-weather-line {
  text-align: right;
}

.project-card-clean .project-card-members {
  margin-top: 0;
}

html[data-theme="dark"] .project-card.project-card-clean {
  background: linear-gradient(180deg, color-mix(in srgb, var(--panel) 88%, var(--accent) 12%), var(--surface-card-soft, var(--panel-soft)));
}

html[data-theme="dark"] .project-card.project-card-clean:hover {
  background: linear-gradient(180deg, color-mix(in srgb, var(--panel) 82%, var(--accent) 18%), var(--surface-card-soft, var(--panel-soft)));
}

@media (max-width: 560px) {
  .project-grid {
    grid-template-columns: 1fr;
  }
  .project-row {
    grid-template-columns: 1fr auto;
    gap: 8px 12px;
  }
  .project-row-code,
  .project-row-name,
  .project-row-manager {
    grid-column: 1;
  }
  .project-row-action {
    grid-column: 2;
    grid-row: 1 / span 3;
  }
  .project-clean-head,
  .project-clean-footline {
    flex-direction: column;
    align-items: stretch;
  }
  .project-card-actions,
  .project-clean-weather-line {
    justify-content: flex-start;
    text-align: left;
  }
  .project-clean-kpis {
    grid-template-columns: 1fr;
  }
  .project-clean-reminder {
    grid-template-columns: 1fr;
  }
  .project-clean-reminder em {
    grid-column: auto;
  }
}


/* ==========================================================================
   7. MODULE : DASHBOARD (widgets)
   --------------------------------------------------------------------------
   Layout en grilles successives :
   - .project-hero (bandeau projet)
   - .dashboard-row-contracts-financial (ligne 1 : Contrats + Finance)
   - .dashboard-row-map-reminders (ligne 2 : Carte + Rappels)
   - .dashboard-row-bottom (ligne 3 : Mairie + Veille + Météo)
   ========================================================================== */

#projectDashboard {
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
}

.project-cover,
.dashboard-v1333-cover {
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
}

/* === HERO PROJET (bandeau du haut, plat et sobre) === */
.project-hero {
  background: var(--panel);
  border: 1px solid var(--border);
  border-left: 3px solid var(--accent);
  color: var(--text);
  border-radius: var(--r-md);
  padding: var(--sp-5);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-5);
  flex-wrap: wrap;
}

.project-hero h2 {
  color: var(--text-strong);
  font-size: var(--fs-2xl);
  font-weight: 700;
  letter-spacing: -0.02em;
  font-family: var(--font-mono);
}
.project-hero .meta {
  color: var(--text-muted);
  margin-top: var(--sp-1);
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.project-hero-actions {
  display: flex;
  gap: var(--sp-2);
  flex-wrap: wrap;
}
.hero-btn {
  background: var(--bg-soft);
  border: 1px solid var(--border);
  color: var(--text);
  font-weight: 600;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.hero-btn:hover:not(:disabled) {
  background: var(--accent-soft);
  border-color: var(--accent);
  color: var(--accent-dark);
}

/* === LAYOUT DES LIGNES === */
.dashboard-v1333-layout {
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
}

.dashboard-row,
.dashboard-row-contracts,
.dashboard-row-contracts-financial,
.dashboard-row-map-reminders,
.dashboard-row-bottom {
  display: grid;
  gap: var(--sp-4);
  align-items: stretch;
}

.dashboard-row-contracts { grid-template-columns: 1fr; }
.dashboard-row-contracts-financial { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
.dashboard-row-map-reminders { grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); }
.dashboard-row-bottom { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); }

/* === BASE COMMUNE des cartes dashboard (toutes identiques + animation décollement) === */
.dashboard-contracts-card,
.financial-widget,
.dashboard-map-card,
.dashboard-reminders-card,
.mayor-card,
.news-card-preview,
.weather-card,
.board-card,
.nav-widget {
  --card-accent: var(--accent-dark);
  position: relative;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-4) var(--sp-5);
  box-shadow: var(--shadow-sm);
  transition: transform var(--t-slow), box-shadow var(--t-slow), border-color var(--t-slow), background var(--t-slow);
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  overflow: hidden;
  color: var(--text);
  will-change: transform;
}

/* Liseré menthe animé sur TOUTES les cartes dashboard */
.dashboard-contracts-card::before,
.financial-widget::before,
.dashboard-map-card::before,
.dashboard-reminders-card::before,
.mayor-card::before,
.news-card-preview::before,
.weather-card::before,
.board-card::before,
.nav-widget::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--card-accent);
  border-radius: var(--r-md) var(--r-md) 0 0;
  pointer-events: none;
  opacity: 0;
  transform: scaleX(0.6);
  transition: opacity var(--t-slow), transform var(--t-slow);
  z-index: 1;
}
.dashboard-contracts-card:hover::before,
.financial-widget:hover::before,
.dashboard-map-card:hover::before,
.dashboard-reminders-card:hover::before,
.mayor-card:hover::before,
.news-card-preview:hover::before,
.weather-card:hover::before,
.board-card:hover::before,
.nav-widget:hover::before {
  opacity: 1;
  transform: scaleX(1);
}

/* === Animation décollement au hover (toutes les cartes) === */
.dashboard-contracts-card:hover,
.financial-widget:hover,
.dashboard-map-card:hover,
.dashboard-reminders-card:hover,
.mayor-card:hover,
.news-card-preview:hover,
.weather-card:hover,
.board-card:hover,
.nav-widget:hover,
.townhall-card:hover,
.reminder-card:hover,
.history-card:hover,
.import-card:hover,
.project-card:hover {
  transform: translateY(-5px);
  border-color: var(--card-accent, var(--accent));
  background: var(--accent-soft);
  box-shadow: 0 16px 36px rgba(0, 0, 0, .13), 0 0 0 2px var(--card-accent, var(--accent));
}
html[data-theme="dark"] .dashboard-contracts-card:hover,
html[data-theme="dark"] .financial-widget:hover,
html[data-theme="dark"] .dashboard-map-card:hover,
html[data-theme="dark"] .dashboard-reminders-card:hover,
html[data-theme="dark"] .mayor-card:hover,
html[data-theme="dark"] .news-card-preview:hover,
html[data-theme="dark"] .weather-card:hover,
html[data-theme="dark"] .board-card:hover,
html[data-theme="dark"] .nav-widget:hover,
html[data-theme="dark"] .townhall-card:hover,
html[data-theme="dark"] .reminder-card:hover,
html[data-theme="dark"] .history-card:hover,
html[data-theme="dark"] .import-card:hover,
html[data-theme="dark"] .project-card:hover {
  background: var(--accent-soft);
  box-shadow: 0 16px 36px rgba(0, 0, 0, .5), 0 0 0 2px var(--card-accent, var(--accent));
}

/* Boutons cartes du dashboard : pas de décalage texte au hover */
button.dashboard-contracts-card:active,
button.dashboard-map-card:active,
button.nav-widget:active {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, .10), 0 0 0 2px var(--card-accent, var(--accent));
}

/* === LISERÉ ACCENT (toutes les cartes en accent menthe identique pour harmonie)
   On garde le système de --card-accent pour les éléments internes (icônes, KPI)
   mais le LISERÉ visible passe partout en menthe */
.accent-card { position: relative; }
.accent-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--card-accent, var(--accent));
  border-radius: var(--r-md) var(--r-md) 0 0;
  pointer-events: none;
  opacity: 0;
  transform: scaleX(0.6);
  transition: opacity var(--t-slow), transform var(--t-slow);
}
.accent-card:hover::before {
  opacity: 1;
  transform: scaleX(1);
}

/* Variables --card-accent : menthe forte sur toutes les cartes */
.accent-contracts,
.accent-finance,
.accent-map,
.accent-reminders,
.accent-townhall,
.accent-news,
.accent-weather { --card-accent: var(--accent-dark); }

/* === EN-TÊTE DE CARTE (icon + titre + sous-titre) === */
.board-card-head,
.card-head,
.widget-head,
.nav-widget-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--sp-3);
  margin-bottom: var(--sp-2);
}
.board-card-title,
.card-title,
.widget-title-wrap {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  min-width: 0;
}
.board-card-title > div,
.card-title > div,
.widget-title-wrap > div {
  min-width: 0;
}

.board-icon {
  width: 32px;
  height: 32px;
  min-width: 32px;
  border-radius: var(--r-md);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  background: color-mix(in srgb, var(--card-accent, var(--accent)) 12%, transparent);
  color: var(--card-accent, var(--accent));
  border: 1px solid color-mix(in srgb, var(--card-accent, var(--accent)) 20%, transparent);
}

/* Titres de cartes — plus gros, signature "Terminal Pro" */
.board-card h3,
.board-card-title h3,
.card-head h3,
.card-title h3,
.widget-head h3,
.widget-title-wrap h3,
.dashboard-contracts-card h3,
.financial-widget h3,
.dashboard-map-card h3,
.dashboard-reminders-card h3,
.mayor-card h3,
.news-card-preview h3,
.weather-card h3,
.nav-widget-title {
  font-family: var(--font-mono);
  font-size: var(--fs-md);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--warning);
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  line-height: 1.2;
}
.dashboard-contracts-card h3::before,
.financial-widget h3::before,
.dashboard-map-card h3::before,
.dashboard-reminders-card h3::before,
.mayor-card h3::before,
.news-card-preview h3::before,
.weather-card h3::before,
.nav-widget-title::before {
  content: "•";
  color: var(--accent);
  font-size: 1.4em;
  line-height: 0;
  letter-spacing: 0;
}

/* === Labels uppercase agrandis aussi === */
.gf-label,
.section-label,
.card-label,
.diagnostic h3,
.project-menu-title,
.filter-block h4 {
  font-size: var(--fs-sm);
  letter-spacing: 0.08em;
}

.board-card .meta,
.dashboard-contracts-card .meta,
.financial-widget .meta,
.dashboard-map-card .nav-widget-desc,
.dashboard-reminders-card .meta,
.mayor-card .meta,
.news-card-preview .meta,
.weather-card .meta {
  color: var(--text-muted);
  font-size: var(--fs-xs);
  margin-top: 2px;
}

/* === CONTRATS & FONCIER === */
.dashboard-contracts-card { min-height: 240px; }

.foncier-clean-main {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--sp-5);
  align-items: center;
}

.foncier-ring {
  position: relative;
  width: 120px;
  height: 120px;
  display: grid;
  place-items: center;
}
.foncier-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.foncier-ring-track { stroke: var(--bg-soft); }
.foncier-ring-progress { stroke: var(--module-contracts); transition: stroke-dashoffset 400ms ease; }
.foncier-ring-content {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  text-align: center;
}
.ring-value {
  font-size: 26px;
  font-weight: 800;
  color: var(--module-contracts);
  letter-spacing: -0.02em;
  line-height: 1;
}
.ring-label,
.foncier-ring-label {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  margin-top: var(--sp-1);
}

.foncier-clean-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-2);
}
.foncier-kpi-line,
.foncier-clean-kpis .kpi {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-3);
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  min-height: 56px;
}
.foncier-kpi-icon {
  width: 28px;
  height: 28px;
  border-radius: var(--r-sm);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 14px;
  background: var(--accent-soft);
}
.foncier-kpi-line strong {
  display: block;
  font-size: var(--fs-sm);
  font-weight: 700;
  color: var(--text-strong);
  line-height: 1.2;
}
.foncier-kpi-line span:not(.foncier-kpi-icon) {
  display: block;
  font-size: var(--fs-xs);
  color: var(--text-muted);
}

/* Pills statuts en bas (61% Pas de contact · 36) */
.foncier-status-line {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2);
  margin-top: var(--sp-2);
  padding-top: var(--sp-3);
  border-top: 1px solid var(--border);
}
.foncier-status-pill {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
  padding: 4px var(--sp-2);
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  font-size: var(--fs-xs);
  color: var(--text-secondary);
  font-family: var(--font-mono);
}
.foncier-status-pill.signe       { color: var(--status-signe);       border-color: color-mix(in srgb, var(--status-signe) 30%, transparent); }
.foncier-status-pill.contacte    { color: var(--status-contacte);    border-color: color-mix(in srgb, var(--status-contacte) 30%, transparent); }
.foncier-status-pill.signature   { color: var(--status-signature);   border-color: color-mix(in srgb, var(--status-signature) 30%, transparent); }
.foncier-status-pill.refus       { color: var(--status-refus);       border-color: color-mix(in srgb, var(--status-refus) 30%, transparent); }
.foncier-status-pill.non-contacte{ color: var(--status-non-contacte); }

/* === CHIFFRES & PRODUCTIBLE (financial-widget) === */
.financial-widget { min-height: 240px; }

.financial-kpi-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sp-2);
}
.financial-kpi-grid > div {
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-3);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.financial-kpi-grid strong {
  font-size: var(--fs-lg);
  font-weight: 700;
  color: var(--text-strong);
  letter-spacing: -0.01em;
}
.financial-kpi-grid > div:first-child strong {
  color: var(--module-financial);
  font-size: var(--fs-xl);
}
.financial-kpi-grid span {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
}

.financial-base-info {
  margin-top: var(--sp-2);
  padding-top: var(--sp-3);
  border-top: 1px solid var(--border);
  font-size: var(--fs-xs);
  color: var(--text-muted);
  font-style: italic;
}

/* === CARTE PROJET (preview dans dashboard) === */
.dashboard-map-card { min-height: 380px; }
.dashboard-map-card .nav-widget-desc { margin-bottom: var(--sp-3); }

.dashboard-map-preview,
.nav-widget-map .dashboard-map-preview {
  flex: 1;
  min-height: 280px;
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
  overflow: hidden;
  background: var(--bg-soft);
  position: relative;
}

/* === RAPPELS À SUIVRE (widget dashboard, layout amélioré) === */
.dashboard-reminders-card { min-height: 380px; }

.reminder-summary {
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: var(--sp-3);
  flex: 1;
  margin-top: var(--sp-2);
}

/* Compteur grand en haut */
.reminder-total {
  display: flex;
  align-items: baseline;
  gap: var(--sp-2);
  padding-bottom: var(--sp-3);
  border-bottom: 1px solid var(--border);
}
.reminder-total strong {
  font-size: var(--fs-2xl);
  font-weight: 700;
  color: var(--module-reminders);
  line-height: 1;
  letter-spacing: -0.02em;
}
.reminder-total span,
.reminder-total .meta {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: 600;
}

/* Prochain rappel : carte mise en valeur */
.next-reminder {
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-left: 3px solid var(--module-reminders);
  border-radius: var(--r-md);
  padding: var(--sp-4);
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  min-height: 0;
}
.next-reminder > strong:first-child {
  display: block;
  color: var(--text-strong);
  font-weight: 700;
  font-size: var(--fs-md);
  letter-spacing: -0.01em;
  line-height: 1.3;
}
.next-reminder .meta {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--module-reminders);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.next-reminder span:not(.meta) {
  display: block;
  font-size: var(--fs-sm);
  color: var(--text-secondary);
  line-height: 1.5;
}
.next-reminder p {
  font-size: var(--fs-sm);
  color: var(--text-secondary);
  margin-top: var(--sp-1);
}
.next-reminder .reminder-date {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--module-reminders);
  font-weight: 600;
}

/* Hint final */
.widget-hint {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  text-align: center;
  padding-top: var(--sp-2);
  border-top: 1px solid var(--border-soft);
}

/* === MAIRIE === */
.mayor-card { min-height: 280px; }
.mayor-info-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-2);
  margin-top: var(--sp-2);
}
.mayor-info {
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-3);
}
.mayor-info strong {
  display: block;
  color: var(--text-strong);
  margin-bottom: var(--sp-1);
}
.mayor-info span {
  font-size: var(--fs-sm);
  color: var(--text-secondary);
}

/* === VEILLE LOCALE (dashboard) === */
.news-card-preview { min-height: 280px; }
.integrated-watch-card { min-height: 280px; }

.watch-preview-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-2);
  margin: var(--sp-2) 0;
}
.watch-preview-kpis div {
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-2);
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.watch-preview-kpis strong {
  font-size: var(--fs-xl);
  font-weight: 700;
  color: var(--module-watch);
  letter-spacing: -0.02em;
  line-height: 1;
}
.watch-preview-kpis span {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.watch-preview-results {
  display: grid;
  gap: var(--sp-2);
  margin-bottom: var(--sp-3);
}
.watch-preview-item,
.watch-preview-empty {
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-3);
  transition: var(--t);
}
.watch-preview-item:hover {
  border-color: var(--module-watch);
  background: var(--panel);
}
.watch-preview-item-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-2);
  margin-bottom: var(--sp-2);
}
.watch-preview-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px var(--sp-2);
  border-radius: var(--r-sm);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-family: var(--font-mono);
  border: 1px solid transparent;
}
.watch-preview-badge.nouveau   { background: rgba(3, 105, 161, .12); color: var(--module-watch); border-color: rgba(3, 105, 161, .25); }
.watch-preview-badge.important { background: rgba(201, 67, 67, .12); color: var(--danger); border-color: rgba(201, 67, 67, .25); }
.watch-preview-badge.vu        { background: rgba(46, 157, 91, .12); color: var(--success); border-color: rgba(46, 157, 91, .25); }
.watch-preview-badge.archive   { background: var(--bg-soft); color: var(--text-muted); border-color: var(--border); }
.watch-preview-badge.bruit     { background: var(--bg-soft); color: var(--text-subtle); }
html[data-theme="dark"] .watch-preview-badge.nouveau   { background: rgba(56, 189, 248, .15); color: var(--module-watch); border-color: rgba(56, 189, 248, .3); }
html[data-theme="dark"] .watch-preview-badge.important { background: rgba(239, 85, 85, .15); color: var(--danger); border-color: rgba(239, 85, 85, .3); }
html[data-theme="dark"] .watch-preview-badge.vu        { background: rgba(74, 222, 128, .15); color: var(--success); border-color: rgba(74, 222, 128, .3); }

.watch-preview-date {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--text-muted);
  white-space: nowrap;
}
.watch-preview-item strong {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: var(--fs-sm);
  font-weight: 600;
  color: var(--text);
  line-height: 1.35;
  margin-bottom: 4px;
}
.watch-preview-source {
  display: block;
  font-size: var(--fs-xs);
  color: var(--text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.watch-preview-more {
  font-size: var(--fs-xs);
  color: var(--text-muted);
  font-style: italic;
  margin-bottom: var(--sp-2);
}
.watch-preview-actions {
  display: flex;
  gap: var(--sp-2);
  margin-top: auto;
}
.watch-preview-actions button { flex: 1; }

/* === MÉTÉO === */
.weather-card { min-height: 280px; }
.weather-card.weather-compact .board-card-head { margin-bottom: var(--sp-2); }

.weather-today {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-3);
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
}
.weather-today-icon { font-size: 32px; line-height: 1; }
.weather-today-main {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.weather-today-main strong { color: var(--text-strong); font-weight: 600; }
.weather-today-temp {
  font-size: var(--fs-xl);
  font-weight: 700;
  color: var(--module-weather);
  letter-spacing: -0.02em;
}
.weather-today-detail {
  font-size: var(--fs-xs);
  color: var(--text-muted);
}

.weather-week-title {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  margin: var(--sp-3) 0 var(--sp-2);
}
.weather-week-title::before { content: "• "; color: var(--accent); }

.weather-hourly {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(72px, 1fr);
  gap: var(--sp-2);
  overflow-x: auto;
  padding-bottom: 4px;
  scrollbar-width: thin;
}
.weather-hour {
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-2);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  min-width: 72px;
}
.weather-hour strong {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.weather-hour .weather-ico { font-size: 18px; }
.weather-hour span {
  font-size: var(--fs-xs);
  color: var(--text-secondary);
}

.weather-week {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: var(--sp-2);
}
.weather-day {
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-2);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  min-height: 80px;
}
.weather-day strong {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.weather-day .weather-ico { font-size: 22px; margin: 2px 0; }
.weather-day .weather-temp {
  font-size: var(--fs-xs);
  color: var(--text-secondary);
  font-weight: 600;
}
.weather-status {
  font-size: var(--fs-xs);
  color: var(--text-muted);
  margin-top: var(--sp-2);
  font-style: italic;
}


/* ==========================================================================
   8. MODULE : CONTRACTS (liste + fiche latérale)
   ========================================================================== */

.contracts-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: var(--sp-4);
}
.contracts-controls {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  flex-wrap: wrap;
}

/* Switch primaire Vue propriétaire / Vue exploitation */
.contracts-primary-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 4px;
  margin-bottom: var(--sp-4);
  gap: 4px;
}
.contracts-switch-btn {
  background: transparent;
  border: 1px solid transparent;
  color: var(--text-muted);
  font-weight: 600;
  padding: var(--sp-3) var(--sp-4);
  border-radius: var(--r-md);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  cursor: pointer;
  transition: var(--t);
  font-size: var(--fs-sm);
}
.contracts-switch-btn:hover {
  color: var(--text);
  background: var(--panel);
}
.contracts-switch-btn.active {
  background: var(--accent);
  color: var(--accent-on);
  border-color: var(--accent);
}

/* Bouton "← Retour vue projet" */
.secondary-back {
  margin-bottom: var(--sp-3);
}
.secondary-back button {
  background: var(--accent-soft);
  color: var(--accent);
  border-color: transparent;
  font-weight: 600;
}
.secondary-back button:hover {
  background: var(--accent);
  color: var(--accent-on);
  border-color: var(--accent);
}

/* === LAYOUT contrats : liste + détail === */
.contracts-list-panel {
  margin-bottom: var(--sp-4);
}
.contracts-list-panel.contracts-list-panel-v13321 {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  padding: var(--sp-4);
  box-shadow: var(--shadow-sm);
}

.contract-list,
.owner-list {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
}
.contract-list.compact { gap: 6px; }

/* === Lignes contrats / propriétaires (pleine largeur, lisibilité maximale) === */
.contract-row,
.owner-row {
  display: grid;
  grid-template-columns: auto 150px minmax(220px, 1.4fr) minmax(280px, 2fr) minmax(180px, 1fr);
  gap: var(--sp-4);
  align-items: center;
  padding: var(--sp-3) var(--sp-4);
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  cursor: pointer;
  transition: transform var(--t), border-color var(--t), background var(--t), box-shadow var(--t);
  position: relative;
  width: 100%;
}
.contract-row:hover,
.owner-row:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}
.contract-row.active,
.owner-row.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  border-left: 3px solid var(--accent);
}

/* Nom propriétaire (colonne 3) : plus visible */
.contract-row strong,
.owner-row strong {
  color: var(--text-strong);
  font-weight: 700;
  font-size: var(--fs-sm);
  line-height: 1.3;
  letter-spacing: -0.01em;
  font-family: var(--font-sans);
}

/* Parcelles + détails (colonne 4) : monospace pour aérer la lecture */
.contract-row span,
.owner-row span {
  color: var(--text-muted);
  font-size: var(--fs-xs);
  line-height: 1.4;
  font-family: var(--font-mono);
}

/* Statistiques de fin de ligne (1 contrat · 4 parcelles · ...) alignées à droite */
.contract-row > span:last-child,
.owner-row > span:last-child {
  text-align: right;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-secondary);
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.contract-row input[type="checkbox"],
.owner-row input[type="checkbox"] {
  width: 16px;
  height: 16px;
  cursor: pointer;
  accent-color: var(--accent);
}

/* La liste elle-même prend toute la largeur disponible */
.contract-list,
.owner-list,
#contractList {
  width: 100%;
  max-width: 100%;
}

/* === LIGNES PROPRIÉTAIRE COMPACTES (vue actuelle utilisée par renderOwnerProjectCard)
   Structure HTML :
   .owner-compact-row-wrap > [.owner-export-check + .owner-compact-row]
   .owner-compact-row contient : .owner-compact-statuses, .owner-compact-name,
                                 .owner-compact-parcels, .owner-compact-meta */
.owner-compact-row-wrap {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--sp-3);
  align-items: stretch;
  width: 100%;
}

.owner-export-check {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 var(--sp-2);
  cursor: pointer;
}
.owner-export-check input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--accent);
  cursor: pointer;
}

.owner-compact-row {
  display: grid;
  grid-template-columns: 160px minmax(220px, 1.4fr) minmax(280px, 2fr) minmax(220px, 1fr);
  gap: var(--sp-4);
  align-items: center;
  padding: var(--sp-3) var(--sp-4);
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  cursor: pointer;
  transition: transform var(--t), border-color var(--t), background var(--t), box-shadow var(--t);
  width: 100%;
  text-align: left;
  font-family: inherit;
  font-size: inherit;
  color: var(--text);
}
.owner-compact-row:hover:not(:disabled):not(.disabled) {
  border-color: var(--accent);
  background: var(--accent-soft);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}
.owner-compact-row.disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.owner-compact-statuses {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
}

.owner-compact-name {
  font-family: var(--font-sans);
  font-weight: 700;
  color: var(--text-strong);
  font-size: var(--fs-sm);
  letter-spacing: -0.01em;
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.owner-compact-parcels {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-muted);
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.owner-compact-meta {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-secondary);
  text-align: right;
  letter-spacing: 0.01em;
  white-space: nowrap;
}

/* Responsive */
@media (max-width: 1280px) {
  .owner-compact-row {
    grid-template-columns: 140px minmax(180px, 1.2fr) minmax(220px, 2fr) minmax(180px, 1fr);
    gap: var(--sp-3);
  }
}
@media (max-width: 1024px) {
  .owner-compact-row {
    grid-template-columns: auto minmax(0, 1fr);
    gap: var(--sp-2);
    grid-auto-flow: row;
  }
  .owner-compact-name { grid-column: 1 / -1; }
  .owner-compact-parcels { grid-column: 1 / -1; }
  .owner-compact-meta { grid-column: 1 / -1; text-align: left; }
}

/* Responsive : repassage colonne unique sur écrans étroits */
@media (max-width: 1280px) {
  .contract-row,
  .owner-row {
    grid-template-columns: auto 130px minmax(0, 1.5fr) minmax(0, 2fr) minmax(140px, auto);
    gap: var(--sp-3);
  }
}
@media (max-width: 1024px) {
  .contract-row,
  .owner-row {
    grid-template-columns: auto auto minmax(0, 1fr);
    gap: var(--sp-2);
  }
  .contract-row > *:nth-child(n+4),
  .owner-row > *:nth-child(n+4) {
    grid-column: 3 / -1;
    padding-left: 0;
    text-align: left;
  }
}

/* Cloche de rappel (alerte) */
.bell {
  width: 26px;
  height: 26px;
  background: rgba(224, 179, 65, .15);
  border: 1px solid rgba(224, 179, 65, .3);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--warning);
  font-size: 14px;
  flex-shrink: 0;
}

/* === STATUT MINI BADGE (devant chaque ligne) === */
.owner-status-mini,
.status-pill,
.status-mini {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
  padding: 4px var(--sp-2);
  border-radius: 999px;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  color: var(--text-secondary);
  white-space: nowrap;
}

/* Variantes statut (couvrent toutes les classes possibles) */
.status-pas-de-contact,
.owner-status-mini.status-pas-de-contact,
.pill-pas-de-contact {
  background: color-mix(in srgb, var(--status-non-contacte) 15%, transparent);
  color: var(--status-non-contacte);
  border-color: color-mix(in srgb, var(--status-non-contacte) 30%, transparent);
}
.status-contacte,
.owner-status-mini.status-contacte,
.pill-contacte {
  background: color-mix(in srgb, var(--status-contacte) 15%, transparent);
  color: var(--status-contacte);
  border-color: color-mix(in srgb, var(--status-contacte) 30%, transparent);
}
.status-en-cours-signature,
.status-signature,
.owner-status-mini.status-en-cours-signature,
.owner-status-mini.status-signature,
.pill-en-cours-signature {
  background: color-mix(in srgb, var(--status-signature) 15%, transparent);
  color: var(--status-signature);
  border-color: color-mix(in srgb, var(--status-signature) 30%, transparent);
}
.status-signe,
.owner-status-mini.status-signe,
.pill-signe {
  background: color-mix(in srgb, var(--status-signe) 15%, transparent);
  color: var(--status-signe);
  border-color: color-mix(in srgb, var(--status-signe) 30%, transparent);
}
.status-refus,
.owner-status-mini.status-refus,
.pill-refus {
  background: color-mix(in srgb, var(--status-refus) 15%, transparent);
  color: var(--status-refus);
  border-color: color-mix(in srgb, var(--status-refus) 30%, transparent);
}
.status-sans-contrat,
.owner-status-mini.status-sans-contrat,
.pill-sans-contrat {
  background: var(--bg-soft);
  color: var(--text-muted);
  border-color: var(--border);
}

/* === FILTRES PROPRIÉTAIRES (au-dessus de la liste) === */
.owners-toolbar,
.owner-filters,
.owner-filter-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-3);
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  margin-bottom: var(--sp-3);
}
.owner-filter-row label,
.owners-toolbar label {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  cursor: pointer;
  color: var(--text);
  font-size: var(--fs-sm);
  font-weight: 500;
}

/* === FICHE CONTRAT (panneau latéral droit) === */
.contract-detail,
.owner-detail {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  padding: var(--sp-5);
  box-shadow: var(--shadow-md);
  color: var(--text);
}

.contract-detail-panel {
  position: fixed;
  top: var(--topbar-h);
  right: 0;
  bottom: 0;
  width: min(640px, 90vw);
  z-index: 90;
  overflow-y: auto;
  padding: var(--sp-5);
  border-radius: var(--r-xl) 0 0 0;
  border: none;
  border-top: 1px solid var(--border);
  border-left: 1px solid var(--border);
  transform: translateX(100%);
  transition: transform 280ms cubic-bezier(.4, 0, .2, 1);
  box-shadow: var(--shadow-lg);
}
.contract-detail-panel.open { transform: translateX(0); }
.contract-detail-panel.collapsed-detail { transform: translateX(100%); }
.contract-detail-panel.fullscreen {
  width: calc(100vw - var(--sidebar-w));
  border-radius: 0;
}

/* Espacements aérés entre sections de la fiche */
.contract-detail > *,
.owner-detail > *,
.contract-detail-panel > * {
  margin-bottom: var(--sp-4);
}
.contract-detail > *:last-child,
.owner-detail > *:last-child,
.contract-detail-panel > *:last-child {
  margin-bottom: 0;
}

/* Tableau des parcelles dans la fiche */
.contract-detail table,
.owner-detail table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: var(--fs-xs);
  margin-top: var(--sp-2);
}
.contract-detail table th,
.owner-detail table th {
  text-align: left;
  padding: var(--sp-2) var(--sp-3);
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  font-weight: 600;
  border-bottom: 1px solid var(--border);
  background: var(--panel-soft);
}
.contract-detail table td,
.owner-detail table td {
  padding: var(--sp-2) var(--sp-3);
  border-bottom: 1px solid var(--border-soft);
  color: var(--text);
  vertical-align: middle;
}
.contract-detail table tr:last-child td,
.owner-detail table tr:last-child td {
  border-bottom: none;
}
.contract-detail table tr:hover td,
.owner-detail table tr:hover td {
  background: var(--panel-soft);
}
.contract-detail table strong,
.owner-detail table strong {
  display: block;
  color: var(--text-strong);
  font-weight: 700;
}
.contract-detail table span,
.owner-detail table span {
  display: block;
  color: var(--text-muted);
  font-size: 10px;
  margin-top: 1px;
}

/* Boutons dans le tableau (Voir sur carte) */
.contract-detail table button,
.owner-detail table button {
  font-size: 10px;
  padding: 4px var(--sp-2);
  white-space: nowrap;
}

.contract-detail h3,
.contract-detail h4,
.owner-detail h3,
.owner-detail h4 {
  color: var(--text-strong);
  margin-bottom: var(--sp-2);
}

/* En-tête fiche contrat (titres + statut) */
.contract-detail-header {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  padding-bottom: var(--sp-4);
  border-bottom: 1px solid var(--border);
  margin-bottom: var(--sp-4);
}
.contract-detail-header .contract-title {
  font-size: var(--fs-lg);
  font-weight: 700;
  color: var(--text-strong);
  letter-spacing: -0.01em;
}
.contract-detail-header .contract-subtitle {
  font-size: var(--fs-sm);
  color: var(--text-muted);
}

/* KPI du haut de fiche (0.11 ha, 302 €/ha, 34 €/an) */
.contract-kpi-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-2);
  margin-bottom: var(--sp-4);
}
.contract-kpi,
.contract-kpi-row > div,
.fiche-contrat-kpi {
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-3);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.contract-kpi strong,
.contract-kpi-row > div strong,
.fiche-contrat-kpi strong {
  color: var(--text-strong);
  font-size: var(--fs-md);
  font-weight: 700;
}
.contract-kpi span,
.contract-kpi-row > div span,
.fiche-contrat-kpi span {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
}

/* Actions de la fiche (Grand écran, Supprimer, Fermer) */
.contract-detail-actions {
  display: flex;
  gap: var(--sp-2);
  flex-wrap: wrap;
  margin-bottom: var(--sp-4);
}
.contract-detail-actions button { flex: 1; }

.delete-btn,
.delete-contract,
.contract-detail-actions .danger {
  background: color-mix(in srgb, var(--danger) 12%, transparent);
  color: var(--danger);
  border-color: color-mix(in srgb, var(--danger) 30%, transparent);
}
.delete-btn:hover:not(:disabled),
.delete-contract:hover:not(:disabled) {
  background: var(--danger);
  color: white;
  border-color: var(--danger);
}

/* Sections numérotées (1. Propriétaires / 2. Historique / 3. Rappels) */
.contract-detail .section-block,
.contract-detail-section {
  margin-top: var(--sp-4);
  padding-top: var(--sp-4);
  border-top: 1px solid var(--border);
}
.contract-detail-section h3,
.contract-detail .section-block h3 {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-muted);
  margin-bottom: var(--sp-3);
  font-weight: 700;
}
.contract-detail-section h3::before,
.contract-detail .section-block h3::before {
  content: "• ";
  color: var(--accent);
}

/* Statut foncier select */
.status-select {
  width: 100%;
  margin: var(--sp-2) 0 var(--sp-4);
  font-weight: 600;
}

/* Cartes propriétaires/contacts dans la fiche */
.signataires {
  display: grid;
  gap: var(--sp-3);
}
.signataire-card,
.contact-card,
.person-card {
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-4);
  position: relative;
}
.signataire-card h4,
.contact-card h4 {
  color: var(--text-strong);
  font-weight: 700;
  margin-bottom: var(--sp-1);
}
.signataire-card p,
.contact-card p,
.contact-line {
  color: var(--text-secondary);
  font-size: var(--fs-sm);
  line-height: 1.5;
  margin: 2px 0;
}

/* Boutons "Nouveau" / "Ajouter existant" */
.add-contact-row {
  display: flex;
  gap: var(--sp-2);
  margin-bottom: var(--sp-3);
}
.add-contact-row button {
  flex: 1;
  background: var(--bg-soft);
  border-style: dashed;
  color: var(--text-secondary);
}
.add-contact-row button:hover {
  border-style: solid;
  background: var(--accent-soft);
  color: var(--accent);
}

/* Notes / historique d'échanges */
.note {
  padding: var(--sp-3) 0;
  border-bottom: 1px solid var(--border);
}
.note:last-child { border-bottom: none; }
.note strong {
  display: block;
  color: var(--text-strong);
  margin-bottom: 2px;
}
.note p {
  font-size: var(--fs-sm);
  color: var(--text-secondary);
  margin-top: var(--sp-1);
}

/* Parcelles (tags dans la fiche) */
.parcels {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-1);
  margin-top: var(--sp-2);
}

/* Petites actions (boutons secondaires sous une section) */
.small-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2);
  margin-top: var(--sp-3);
}
.small-actions button {
  font-size: var(--fs-xs);
  padding: var(--sp-2) var(--sp-3);
}

/* Formulaire inline (ajout rapide d'un échange) */
.inline-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sp-3);
  margin-top: var(--sp-3);
}
.inline-form .full { grid-column: 1 / -1; }
.inline-form label {
  display: flex;
  flex-direction: column;
  gap: var(--sp-1);
  font-size: var(--fs-xs);
  color: var(--text-muted);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}


/* ==========================================================================
   9. MODULE : OWNERS (propriétaires + exploitants)
   --------------------------------------------------------------------------
   Vue compacte des propriétaires, filtres par statut, export RP Excel.
   ========================================================================== */

.owners-full-page-mode .owner-list {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  padding: var(--sp-4);
  box-shadow: var(--shadow-sm);
}

.owners-summary {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-3) var(--sp-4);
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  margin-bottom: var(--sp-3);
  font-size: var(--fs-sm);
}
.owners-summary strong {
  color: var(--accent);
  font-size: var(--fs-lg);
  font-weight: 700;
}

.owner-status-export-filters {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-3);
  align-items: center;
  margin-bottom: var(--sp-3);
}
.owner-status-export-filters label {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  cursor: pointer;
  font-size: var(--fs-sm);
}

/* Boutons Tout sélectionner / désélectionner / Export RP Excel */
.owners-actions {
  display: flex;
  gap: var(--sp-2);
  flex-wrap: wrap;
  margin-bottom: var(--sp-3);
  justify-content: flex-end;
}
.owners-actions .export-btn {
  background: var(--accent);
  color: var(--accent-on);
  border-color: var(--accent);
}

/* Vue exploitants */
.operator-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: var(--sp-3);
  align-items: center;
  padding: var(--sp-3) var(--sp-4);
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  cursor: pointer;
  transition: var(--t);
}
.operator-row:hover,
.operator-row.active {
  border-color: var(--module-financial);
  background: color-mix(in srgb, var(--module-financial) 8%, transparent);
}
.operator-row strong {
  color: var(--text-strong);
  font-weight: 700;
}
.operator-row span {
  color: var(--text-muted);
  font-size: var(--fs-xs);
}


/* ==========================================================================
   10. MODULE : MAP (Leaflet + filtres + mesures)
   ========================================================================== */

.map-page {
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  gap: var(--sp-4);
  align-items: start;
}

/* === FILTRES (sidebar carte) === */
.map-filters {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  padding: var(--sp-4);
  box-shadow: var(--shadow-sm);
  position: sticky;
  top: calc(var(--topbar-h) + var(--sp-4));
  max-height: calc(100vh - var(--topbar-h) - var(--sp-7));
  overflow-y: auto;
}
.map-filters h3 {
  font-size: var(--fs-md);
  margin-bottom: var(--sp-3);
}

.filter-block {
  padding-top: var(--sp-3);
  margin-top: var(--sp-3);
  border-top: 1px solid var(--border);
}
.filter-block:first-of-type {
  padding-top: 0;
  margin-top: 0;
  border-top: none;
}
.filter-block h4 {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-muted);
  font-weight: 700;
  margin-bottom: var(--sp-2);
}
.filter-block h4::before {
  content: "• ";
  color: var(--accent);
}

.check-row {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-2) 0;
  font-size: var(--fs-sm);
  cursor: pointer;
  color: var(--text);
}
.check-row input[type="checkbox"] {
  width: 16px;
  height: 16px;
}
.check-row .swatch {
  width: 14px;
  height: 14px;
  border-radius: 3px;
  display: inline-block;
  flex-shrink: 0;
  border: 1px solid var(--border);
}

.filter-actions {
  display: flex;
  gap: var(--sp-2);
  margin: var(--sp-2) 0 var(--sp-3);
}
.filter-actions button {
  flex: 1;
  font-size: var(--fs-xs);
  padding: var(--sp-2);
}

.owner-checks {
  max-height: 280px;
  overflow-y: auto;
  margin-top: var(--sp-2);
}

.cache-status,
.map-cache-status-bottom {
  margin-top: var(--sp-3);
  padding: var(--sp-2) var(--sp-3);
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  font-size: var(--fs-xs);
  color: var(--text-muted);
  font-style: italic;
}

/* Sub-tabs Filtrer par : Contrats / Exploitation */
.map-filter-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 3px;
  gap: 3px;
  margin-bottom: var(--sp-2);
}
.map-filter-tab {
  background: transparent;
  border: 1px solid transparent;
  color: var(--text-muted);
  font-weight: 600;
  font-size: var(--fs-xs);
  padding: var(--sp-2);
  border-radius: var(--r-sm);
  cursor: pointer;
  transition: var(--t);
}
.map-filter-tab:hover {
  color: var(--text);
  background: var(--panel);
}
.map-filter-tab.active {
  background: var(--accent);
  color: var(--accent-on);
}

.map-filter-help {
  font-size: var(--fs-xs);
  color: var(--text-muted);
  font-style: italic;
}

/* === CARTE LEAFLET === */
.map-wrap {
  position: relative;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  overflow: hidden;
  min-height: 620px;
  box-shadow: var(--shadow-sm);
}

#leafletMap {
  width: 100%;
  height: 100%;
  min-height: 620px;
  border-radius: var(--r-xl);
}

/* Recherche commune (overlay sur la carte) */
.map-search-shell {
  position: absolute;
  top: var(--sp-3);
  left: 50px;
  z-index: 1000;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-2);
  box-shadow: var(--shadow-md);
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 280px;
}
.map-search-row {
  display: flex;
  gap: 4px;
}
.map-search-row input {
  flex: 1;
  font-size: var(--fs-sm);
  padding: var(--sp-2);
}
.map-search-row button {
  padding: var(--sp-2) var(--sp-3);
  font-size: var(--fs-xs);
}
.map-commune-suggestions {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  max-height: 200px;
  overflow-y: auto;
  display: none;
  font-size: var(--fs-sm);
}
.map-commune-suggestions.visible { display: block; }
.map-commune-suggestions > div {
  padding: var(--sp-2);
  cursor: pointer;
  border-bottom: 1px solid var(--border-soft);
}
.map-commune-suggestions > div:last-child { border-bottom: none; }
.map-commune-suggestions > div:hover {
  background: var(--accent-soft);
  color: var(--accent);
}

/* Légende (en bas-droite) */
.legend {
  position: absolute;
  right: var(--sp-3);
  bottom: var(--sp-3);
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-3);
  display: grid;
  gap: var(--sp-2);
  font-size: var(--fs-xs);
  box-shadow: var(--shadow-md);
  z-index: 500;
}
.legend-item {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
}
.swatch {
  width: 14px;
  height: 14px;
  border-radius: 3px;
  border: 1px solid var(--border);
}

/* === CONTRÔLES MESURE (Distance / Cercle / Supprimer) === */
.measure-control {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-2);
  box-shadow: var(--shadow-md);
  font-size: var(--fs-xs);
}
.measure-control-title {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  margin-bottom: var(--sp-2);
  font-weight: 700;
}
.measure-buttons {
  display: flex;
  gap: 4px;
}
.measure-buttons button {
  font-size: 11px;
  padding: 4px var(--sp-2);
}
.measure-buttons button.active {
  background: var(--accent);
  color: var(--accent-on);
  border-color: var(--accent);
}
.measure-hint {
  font-size: 10px;
  color: var(--text-muted);
  margin-top: var(--sp-2);
  font-style: italic;
}

.map-wrap.measuring { cursor: crosshair; }
.map-wrap.measure-delete-active { cursor: not-allowed; }

.measure-popup {
  font-size: var(--fs-xs);
  color: var(--text);
}
.measure-delete-btn {
  margin-top: var(--sp-2);
  padding: 4px var(--sp-2);
  font-size: 11px;
  width: 100%;
}

.zone-interet-popup { font-size: var(--fs-sm); }

/* === LOADING / STATUS === */
.map-loading {
  position: absolute;
  top: var(--sp-3);
  right: var(--sp-3);
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-2) var(--sp-3);
  font-size: var(--fs-xs);
  color: var(--accent);
  font-weight: 600;
  box-shadow: var(--shadow-md);
  z-index: 500;
}

/* === LEAFLET overrides (theme aware) === */
.leaflet-control-layers,
.leaflet-control-zoom a {
  background: var(--panel) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}
.leaflet-control-zoom a {
  border-bottom: 1px solid var(--border) !important;
}
.leaflet-control-layers label {
  color: var(--text) !important;
}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
  background: var(--panel) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
}
.leaflet-popup-content {
  font-family: var(--font-base);
  color: var(--text);
}
.leaflet-control-attribution {
  background: rgba(255, 255, 255, .7) !important;
  font-size: 10px !important;
}
html[data-theme="dark"] .leaflet-control-attribution {
  background: rgba(0, 0, 0, .7) !important;
  color: var(--text-muted) !important;
}
html[data-theme="dark"] .leaflet-control-attribution a {
  color: var(--accent) !important;
}

/* === SVG parcelles === */
.parcel {
  stroke: white;
  stroke-width: 2;
  cursor: pointer;
  opacity: 0.85;
  transition: opacity 200ms ease;
}
.parcel:hover {
  opacity: 1;
  stroke-width: 3;
}
.map-label {
  font-size: 12px;
  font-weight: 700;
  fill: var(--text-strong);
  pointer-events: none;
}
.map-bg-line {
  stroke: rgba(45, 122, 95, 0.15);
  stroke-width: 2;
  fill: none;
}

/* === HAUTEUR PROPAGÉE pour la vue carte (critique pour SVG Leaflet) === */
#view-map {
  display: none;
  flex-direction: column;
  height: calc(100vh - var(--topbar-h) - var(--sp-6));
  min-height: 680px;
}
#view-map.active {
  display: flex;
}
#view-map .map-page {
  flex: 1 1 auto;
  min-height: 0;
}
#view-map .map-wrap {
  height: 100%;
}
#view-map #leafletMap {
  height: 100%;
  min-height: 100%;
}

/* === LABELS PARCELLES PROJET (numéros au centre des parcelles)
   IMPORTANT : fond SEMI-TRANSPARENT pour ne pas masquer les polygones colorés
   IMPORTANT : pointer-events: none pour laisser passer les clics vers les parcelles SVG */
.project-parcel-label {
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(17, 24, 39, 0.35);
  color: #111827;
  font-weight: 800;
  font-size: 11px;
  line-height: 1;
  border-radius: var(--r-sm);
  padding: 2px 4px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .18);
  white-space: nowrap;
  pointer-events: none;
}
.project-parcel-label::before {
  display: none;
}
.leaflet-tooltip.project-parcel-label {
  pointer-events: none;
}
html[data-theme="dark"] .project-parcel-label {
  background: rgba(20, 20, 20, 0.86);
  color: #ffffff;
  border-color: rgba(255, 255, 255, .25);
}

/* === TOOLTIPS EXPLOITANTS === */
.operator-parcel-tooltip {
  background: rgba(17, 24, 39, .92);
  color: #ffffff;
  border: 0;
  border-radius: var(--r-sm);
  font-weight: 700;
  padding: 4px 7px;
}

/* === ÉTIQUETTES DE MESURE (distance, cercle, total) === */
.measure-label {
  background: transparent;
  border: none;
}
.measure-label span {
  display: inline-block;
  padding: 4px 7px;
  border-radius: 999px;
  background: var(--panel);
  border: 1px solid var(--border-strong);
  color: var(--text-strong);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .18);
}
.measure-label-total span {
  background: var(--text-strong);
  color: var(--panel);
  border-color: var(--text-strong);
}
.measure-label-center span {
  background: color-mix(in srgb, var(--module-reminders) 18%, transparent);
  color: var(--module-reminders);
  border-color: color-mix(in srgb, var(--module-reminders) 40%, transparent);
}
.measure-label-preview span {
  opacity: .92;
}

/* Point central des cercles de mesure (point violet) */
.measure-center-point {
  background: transparent;
  border: none;
}
.measure-center-point span {
  display: block;
  width: 10px;
  height: 10px;
  padding: 0;
  border-radius: 999px;
  background: var(--module-reminders);
  border: 2px solid var(--panel);
  box-shadow: 0 1px 6px rgba(15, 23, 42, .32);
  font-size: 0;
  line-height: 0;
}

/* Mode suppression mesure : bouton actif rouge */
.measure-buttons button[data-measure-mode="delete"].active {
  border-color: var(--danger);
  background: color-mix(in srgb, var(--danger) 12%, transparent);
  color: var(--danger);
}

/* Cursors carte selon mode */
.map-wrap.measuring,
.map-wrap.measuring .leaflet-container {
  cursor: crosshair !important;
}
.map-wrap.measure-draw-active,
.map-wrap.measure-draw-active .leaflet-container {
  cursor: crosshair !important;
}
.map-wrap.measure-delete-active,
.map-wrap.measure-delete-active .leaflet-container {
  cursor: not-allowed !important;
}

/* === LEAFLET PANES PERSONNALISÉS (z-index critiques)
   Ces panes sont créées dynamiquement par app.js (createPane).
   Sans ces z-index, les parcelles projet n'apparaissent pas sur la carte.
   ========================================================================== */
.leaflet-pane.leaflet-projectGeoJsonReferencePane-pane { z-index: 690 !important; }
.leaflet-pane.leaflet-zoneInteretPane-pane             { z-index: 705 !important; }
.leaflet-pane.leaflet-projectParcelsPane-pane {
  z-index: 720 !important;
  pointer-events: auto;
}
.leaflet-pane.leaflet-operatorParcelsPane-pane         { z-index: 730 !important; }
.leaflet-pane.leaflet-projectParcelLabelsPane-pane {
  z-index: 900 !important;
  pointer-events: none;
}
.leaflet-pane.leaflet-measurePane-pane {
  z-index: 1250 !important;
  pointer-events: auto;
}
.leaflet-pane.leaflet-projectPopupPane-pane,
.leaflet-popup-pane { z-index: 1600 !important; }

/* Contrôle mesure et popup parcelles toujours au-dessus des outils */
.measure-control { z-index: 1300; }
.measure-control,
.leaflet-bottom.leaflet-left .leaflet-control {
  position: relative;
  z-index: 1100 !important;
}
.project-parcel-popup-v2 .leaflet-popup-content-wrapper,
.project-parcel-popup-clean .leaflet-popup-content-wrapper {
  position: relative;
  z-index: 1601;
}

.leaflet-interactive { outline: none; }

/* === Modes mesure (curseurs + interactions) === */
.map-wrap.measuring .leaflet-container { cursor: crosshair; }
.map-wrap.measure-draw-active .leaflet-projectParcelsPane-pane,
.map-wrap.measure-draw-active .leaflet-projectParcelLabelsPane-pane,
.map-wrap.measure-delete-active .leaflet-projectParcelsPane-pane,
.map-wrap.measure-delete-active .leaflet-projectParcelLabelsPane-pane {
  pointer-events: none;
}

/* === DASHBOARD MAP PREVIEW (mini carte du tableau de bord) === */
.nav-widget-map {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  overflow: hidden;
  min-height: 380px;
}
.nav-widget-map .nav-widget-head {
  flex: 0 0 auto;
}
.nav-widget-map .dashboard-map-preview {
  flex: 1 1 auto;
  width: 100%;
  min-height: 280px;
  height: 280px;
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  overflow: hidden;
  background: var(--bg-soft);
  position: relative;
}
.dashboard-map-preview .leaflet-container {
  width: 100%;
  height: 100%;
  background: var(--bg-soft);
}

/* Panes preview (créés par dashboard) — pas de z-index critique mais on assure */
.leaflet-pane.leaflet-previewBasePane-pane    { z-index: 200; }
.leaflet-pane.leaflet-previewParcelsPane-pane { z-index: 400; pointer-events: none; }
.leaflet-pane.leaflet-previewLabelsPane-pane  { z-index: 600; pointer-events: none; }

.map-preview-state {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  padding: var(--sp-4);
  text-align: center;
  color: var(--text-muted);
  font-weight: 600;
  font-size: var(--fs-sm);
  background: color-mix(in srgb, var(--bg) 60%, transparent);
  pointer-events: none;
}

/* Labels parcelles en preview (numéros sur mini carte) */
.preview-parcel-label {
  background: transparent;
  border: none;
}
.preview-parcel-label span {
  display: inline-block;
  min-width: 18px;
  padding: 2px 6px;
  border-radius: 999px;
  background: var(--panel);
  border: 1px solid var(--border);
  color: var(--text);
  font-size: 10px;
  font-weight: 700;
  line-height: 1.1;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .15);
}

/* === CACHE STATUS (info GeoJSON projet en attente) === */
.cache-status[data-tone="ok"] {
  background: var(--accent-soft);
  border-color: color-mix(in srgb, var(--accent) 30%, transparent);
  color: var(--accent);
  font-weight: 700;
  font-style: normal;
}
.cache-status[data-tone="warning"] {
  background: color-mix(in srgb, var(--warning) 12%, transparent);
  border-color: color-mix(in srgb, var(--warning) 30%, transparent);
  color: var(--warning);
  font-style: normal;
}
.cache-status[data-tone="error"] {
  background: color-mix(in srgb, var(--danger) 12%, transparent);
  border-color: color-mix(in srgb, var(--danger) 30%, transparent);
  color: var(--danger);
  font-weight: 700;
  font-style: normal;
}
.cache-status[data-tone="neutral"] {
  background: var(--bg-soft);
  border-color: var(--border);
  color: var(--text-muted);
}

/* === BOUTONS GEOMETRY TOOLS (Mettre à jour la carte projet) === */
.project-geometry-tools {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  margin-bottom: var(--sp-3);
}
.project-geometry-tools button {
  width: 100%;
}


/* ==========================================================================
   11. MODULE : REMINDERS (rappels du projet)
   ========================================================================== */

.reminder-card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  transition: var(--t);
}
.reminder-card:hover {
  border-color: var(--module-reminders);
  box-shadow: var(--shadow-md);
}
.reminder-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-2);
  flex-wrap: wrap;
}
.reminder-card-date {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--module-reminders);
  letter-spacing: 0.04em;
}
.reminder-card-type {
  display: inline-flex;
  align-items: center;
  padding: 2px var(--sp-2);
  background: color-mix(in srgb, var(--module-reminders) 15%, transparent);
  color: var(--module-reminders);
  border-radius: var(--r-sm);
  font-size: var(--fs-xs);
  font-weight: 600;
  border: 1px solid color-mix(in srgb, var(--module-reminders) 30%, transparent);
}
.reminder-card .reminder-target {
  color: var(--text-strong);
  font-weight: 700;
}
.reminder-card .reminder-note {
  color: var(--text-secondary);
  font-size: var(--fs-sm);
}


/* ==========================================================================
   12. MODULE : TOWNHALL (mairies) — pleine largeur + grid interne
   ========================================================================== */

.townhall-grid,
#townhallList {
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
}

.townhall-card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  padding: var(--sp-5);
  box-shadow: var(--shadow-sm);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--sp-4);
  transition: var(--t);
  width: 100%;
}
.townhall-card:hover {
  border-color: var(--module-mayor);
  box-shadow: var(--shadow-md);
}

/* En-tête : titre + bouton modifier */
.townhall-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--sp-4);
  padding-bottom: var(--sp-3);
  border-bottom: 1px solid var(--border);
}
.townhall-card-header > div:first-child { flex: 1; }
.townhall-card h3 {
  color: var(--text-strong);
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  font-size: var(--fs-lg);
}
.townhall-card h3::before {
  content: "•";
  color: var(--module-mayor);
  font-size: 1em;
}
.townhall-actions {
  display: flex;
  gap: var(--sp-2);
}

/* Position (Favorable/Neutre/Défavorable) */
.position {
  display: inline-flex;
  align-items: center;
  padding: 4px var(--sp-2);
  border-radius: var(--r-sm);
  font-size: var(--fs-xs);
  font-weight: 600;
  background: var(--bg-soft);
  color: var(--text-secondary);
  border: 1px solid var(--border);
  font-family: var(--font-mono);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.position.favorable {
  background: color-mix(in srgb, var(--success) 15%, transparent);
  color: var(--success);
  border-color: color-mix(in srgb, var(--success) 30%, transparent);
}
.position.neutre {
  background: color-mix(in srgb, var(--warning) 18%, transparent);
  color: var(--warning);
  border-color: color-mix(in srgb, var(--warning) 30%, transparent);
}
.position.defavorable {
  background: color-mix(in srgb, var(--danger) 15%, transparent);
  color: var(--danger);
  border-color: color-mix(in srgb, var(--danger) 30%, transparent);
}

/* === Grille des infos mairie (Maire / Tel / Email / Horaires / Adresse) === */
.townhall-info-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--sp-3);
}
.townhall-info-box {
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-4);
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--sp-3);
  min-height: 64px;
}
.townhall-info-box.full {
  grid-column: 1 / -1;
}
/* Carré icône emoji */
.th-icon-box {
  width: 40px;
  height: 40px;
  min-width: 40px;
  background: var(--accent-soft);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
}
/* Dans les info-box mairie : icône positionnée à droite */
.townhall-info-box .th-icon-box {
  order: 1;
  margin-left: auto;
  flex-shrink: 0;
}
.townhall-info-box .th-info-text {
  flex: 1;
  order: 0;
}
/* Texte */
.th-info-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.th-info-text strong {
  color: var(--text-strong);
  font-weight: 600;
  font-size: var(--fs-sm);
}
.th-info-text span {
  color: var(--text-secondary);
  font-size: var(--fs-xs);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Compatibilité ancien style direct */
.townhall-card .townhall-info {
  font-size: var(--fs-sm);
  color: var(--text-secondary);
  line-height: 1.7;
}
.townhall-card .townhall-info strong {
  color: var(--text-strong);
  display: inline-block;
  min-width: 110px;
}

/* === Notes mairie === */
.townhall-notes,
.townhall-card-notes {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  padding-top: var(--sp-3);
  border-top: 1px solid var(--border);
}
.townhall-notes-title,
.townhall-card-notes h4 {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-muted);
  font-weight: 700;
  margin-bottom: var(--sp-2);
}
.townhall-notes-title::before,
.townhall-card-notes h4::before {
  content: "• ";
  color: var(--module-mayor);
}
.townhall-notes textarea,
.townhall-card textarea {
  width: 100%;
  min-height: 90px;
  font-family: inherit;
}

/* === Rappels mairie === */
.townhall-reminders,
.townhall-card-reminders {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  padding-top: var(--sp-3);
  border-top: 1px solid var(--border);
}
.townhall-reminders-title,
.townhall-card-reminders h4 {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-muted);
  font-weight: 700;
  margin-bottom: var(--sp-2);
}
.townhall-reminders-title::before,
.townhall-card-reminders h4::before {
  content: "• ";
  color: var(--module-reminders);
}
.townhall-reminder-form {
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  gap: var(--sp-2);
  align-items: center;
}
.townhall-reminder-form input,
.townhall-reminder-form select {
  width: auto;
}
@media (max-width: 760px) {
  .townhall-reminder-form { grid-template-columns: 1fr; }
}


/* ==========================================================================
   13. MODULE : WATCH (veille pleine page)
   ========================================================================== */

.watch-page {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: var(--sp-4);
  align-items: start;
}

.watch-layout { display: contents; }

.watch-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--sp-2);
  margin-bottom: var(--sp-4);
}
.watch-summary > div {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-3);
  text-align: center;
}
.watch-summary strong {
  display: block;
  font-size: var(--fs-xl);
  font-weight: 700;
  color: var(--module-watch);
  letter-spacing: -0.02em;
}
.watch-summary span {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
}

/* Liste des résultats */
.watch-results { display: flex; flex-direction: column; gap: var(--sp-3); }

.watch-result {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-4);
  transition: var(--t);
}
.watch-result:hover { border-color: var(--module-watch); }
.watch-result-head {
  display: flex;
  justify-content: space-between;
  gap: var(--sp-3);
  margin-bottom: var(--sp-2);
  flex-wrap: wrap;
}
.watch-result-toolbar {
  display: flex;
  gap: var(--sp-2);
  flex-wrap: wrap;
}
.watch-result h4 {
  color: var(--text-strong);
  margin-bottom: var(--sp-1);
}
.watch-result a {
  color: var(--module-watch);
  word-break: break-word;
}
.watch-result-excerpt {
  color: var(--text-secondary);
  font-size: var(--fs-sm);
  line-height: 1.55;
  margin-top: var(--sp-2);
}

/* Sidebar veille (sources, mots-clés) */
.watch-panel-side {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  box-shadow: var(--shadow-sm);
  position: sticky;
  top: calc(var(--topbar-h) + var(--sp-4));
  max-height: calc(100vh - var(--topbar-h) - var(--sp-7));
  overflow-y: auto;
}

.watch-source-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: var(--sp-2);
  align-items: center;
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-2) var(--sp-3);
  margin-bottom: var(--sp-2);
}
.watch-source-row.inactive { opacity: .5; }
.watch-source-row strong,
.watch-source-row span {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.watch-source-row span {
  color: var(--text-muted);
  font-size: var(--fs-xs);
  margin-top: 2px;
}

.watch-add-source {
  background: var(--panel-soft);
  border: 1px dashed var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-3);
  margin-bottom: var(--sp-3);
}
.watch-add-source summary {
  cursor: pointer;
  font-weight: 700;
  color: var(--accent);
  margin-bottom: var(--sp-2);
  font-size: var(--fs-sm);
}
.watch-add-source label,
.watch-panel-side label {
  display: grid;
  gap: 4px;
  margin-bottom: var(--sp-2);
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  font-weight: 600;
}

.watch-keyword-add {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--sp-2);
}

.watch-keywords {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-1);
  margin-bottom: var(--sp-3);
}
.watch-keyword-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px var(--sp-2);
  background: var(--accent-soft);
  color: var(--accent);
  border-radius: var(--r-sm);
  font-size: var(--fs-xs);
  font-weight: 600;
}
.watch-keyword-pill button {
  background: none;
  border: none;
  color: inherit;
  padding: 0 2px;
  font-size: 14px;
  cursor: pointer;
}

.watch-head-actions { display: flex; gap: var(--sp-2); }


/* ==========================================================================
   14. MODULE : ADMIN IMPORT (Excel)
   ========================================================================== */

.import-page {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--sp-4);
}

.import-card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  padding: var(--sp-5);
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
}
.import-card h3 { color: var(--text-strong); }

.import-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sp-3);
}
.import-form label {
  display: flex;
  flex-direction: column;
  gap: var(--sp-1);
  font-size: var(--fs-xs);
  color: var(--text-muted);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.import-form .full { grid-column: 1 / -1; }

.import-warning {
  padding: var(--sp-3);
  background: color-mix(in srgb, var(--warning) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--warning) 30%, transparent);
  border-radius: var(--r-md);
  color: var(--warning);
  font-size: var(--fs-sm);
  font-weight: 500;
}
html[data-theme="dark"] .import-warning {
  color: #fde68a;
}

.card-actions {
  display: flex;
  gap: var(--sp-2);
  flex-wrap: wrap;
  margin-top: var(--sp-2);
}

.import-result {
  font-size: var(--fs-sm);
  color: var(--text-secondary);
  line-height: 1.6;
}


/* ==========================================================================
   15. MODULE : HISTORY (historique du projet)
   ========================================================================== */

.history-card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
}
.history-card .history-date {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.history-card .history-action {
  color: var(--text-strong);
  font-weight: 700;
}
.history-card .history-detail {
  color: var(--text-secondary);
  font-size: var(--fs-sm);
}


/* ==========================================================================
   16. UTILITIES + RESPONSIVE
   ========================================================================== */

/* === Helpers === */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.text-center { text-align: center; }
.text-right  { text-align: right; }
.flex-1 { flex: 1; }
.gap-2 { gap: var(--sp-2); }
.gap-3 { gap: var(--sp-3); }
.gap-4 { gap: var(--sp-4); }
.mt-2 { margin-top: var(--sp-2); }
.mt-3 { margin-top: var(--sp-3); }
.mt-4 { margin-top: var(--sp-4); }
.mb-2 { margin-bottom: var(--sp-2); }
.mb-3 { margin-bottom: var(--sp-3); }
.mb-4 { margin-bottom: var(--sp-4); }

/* État body pendant resize fiche contrat */
body.resizing-contract-column { user-select: none; cursor: col-resize; }
body.map-active { overflow: hidden; }


/* === RESPONSIVE === */

/* Grand écran — pas de changement structurel */

/* Tablet / petit desktop */
@media (max-width: 1280px) {
  .dashboard-row-bottom { grid-template-columns: 1fr 1fr; }
  .dashboard-row-bottom .weather-card { grid-column: 1 / -1; }
  .map-page { grid-template-columns: 280px minmax(0, 1fr); }
  .watch-page { grid-template-columns: minmax(0, 1fr) 280px; }
  .contract-detail-panel { width: min(480px, 90vw); }
}

/* Tablette */
@media (max-width: 980px) {
  :root { --topbar-h: auto; }

  .topbar {
    flex-direction: column;
    align-items: stretch;
    gap: var(--sp-3);
    padding: var(--sp-3);
  }
  .topbar > div:last-child { width: 100%; }
  .sync-box { justify-content: space-between; }

  .layout {
    grid-template-columns: 1fr;
  }
  .sidebar {
    position: relative;
    top: 0;
    max-height: none;
    border-right: none;
    border-bottom: 1px solid var(--border);
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: var(--sp-2);
  }
  .sidebar .nav-btn { margin-bottom: 0; }
  .diagnostic { grid-column: 1 / -1; }

  .dashboard-row-contracts-financial,
  .dashboard-row-map-reminders,
  .dashboard-row-bottom {
    grid-template-columns: 1fr;
  }

  .map-page { grid-template-columns: 1fr; }
  .map-filters { position: relative; top: 0; max-height: none; }

  .watch-page { grid-template-columns: 1fr; }
  .watch-panel-side { position: relative; top: 0; max-height: none; }

  .import-page { grid-template-columns: 1fr; }

  .contract-row,
  .owner-row {
    grid-template-columns: auto auto minmax(0, 1fr);
  }
  .contract-row > *:nth-child(n+4),
  .owner-row > *:nth-child(n+4) {
    grid-column: 1 / -1;
    padding-left: 32px;
  }

  .contract-detail-panel {
    width: 100vw;
    border-radius: 0;
  }
}

/* Mobile */
@media (max-width: 640px) {
  .content { padding: var(--sp-3); }

  .section-head {
    flex-direction: column;
    align-items: stretch;
  }

  .topbar h1 { font-size: var(--fs-md); }

  .project-grid { grid-template-columns: 1fr; }
  .project-hero {
    flex-direction: column;
    align-items: stretch;
    text-align: left;
  }
  .project-hero h2 { font-size: var(--fs-xl); }

  .dashboard-grid,
  .watch-summary,
  .financial-kpi-grid,
  .contract-kpi-row,
  .foncier-clean-kpis,
  .watch-preview-kpis {
    grid-template-columns: 1fr;
  }

  .weather-week { grid-template-columns: repeat(7, minmax(60px, 1fr)); overflow-x: auto; }
  .weather-hourly { grid-auto-columns: minmax(64px, 1fr); }

  .contracts-controls,
  .filter-actions,
  .import-form {
    grid-template-columns: 1fr;
    flex-direction: column;
    align-items: stretch;
  }

  .map-search-shell { width: calc(100% - 80px); }
}

/* === Modal Comparison Financière === */
.financial-detail-link {
  background: none;
  border: none;
  color: var(--accent-primary);
  text-decoration: underline;
  cursor: pointer;
  font-size: inherit;
  padding: 0;
  font-weight: 600;
}

.financial-detail-link:hover {
  color: var(--accent-dark);
}

.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10000;
}

.financial-comparison-modal {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.financial-comparison-modal .modal-content {
  background: var(--bg-secondary);
  border-radius: 8px;
  padding: 2rem;
  max-width: 900px;
  max-height: 85vh;
  overflow-y: auto;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
  color: var(--text-primary);
}

.financial-comparison-modal h2 {
  margin-top: 0;
  margin-bottom: 1.5rem;
  text-align: center;
  font-size: 1.4rem;
}

.comparison-grids {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  margin-bottom: 2rem;
}

.comparison-section {
  padding: 1rem;
  border: 1px solid var(--border-color);
  border-radius: 6px;
  background: var(--bg-primary);
}

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

.comparison-table thead {
  background: var(--accent-subtle);
}

.comparison-table th {
  padding: 0.75rem;
  text-align: left;
  font-weight: 600;
  border-bottom: 2px solid var(--border-color);
  color: var(--text-primary);
}

.comparison-table td {
  padding: 0.75rem;
  border-bottom: 1px solid var(--border-color);
}

.comparison-table td:first-child {
  font-weight: 500;
  color: var(--text-secondary);
  width: 50%;
}

.comparison-table td:last-child {
  text-align: right;
  color: var(--text-primary);
}

.comparison-table tr.highlight {
  background: var(--accent-subtle);
  font-weight: 600;
}

.comparison-result {
  background: var(--accent-subtle);
  border: 1px solid var(--accent-border);
  border-radius: 6px;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
  text-align: center;
}

.comparison-result p {
  margin: 0.5rem 0;
  font-size: 1rem;
}

.comparison-result strong {
  color: var(--accent-primary);
  font-size: 1.1rem;
}

.financial-comparison-modal .primary {
  display: block;
  margin: 0 auto;
}

/* Responsive */
@media (max-width: 768px) {
  .financial-comparison-modal .modal-content {
    margin: 1rem;
    max-height: 90vh;
    padding: 1.5rem;
  }

  .comparison-grids {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .comparison-table {
    font-size: 0.85rem;
  }

  .comparison-table td {
    padding: 0.5rem;
  }
}

/* === FIN STYLE V2 === */

/* === Modal Génération DOCX === */

.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.modal-overlay.hidden {
  display: none;
}

.modal-content {
  background: var(--panel);
  color: var(--text);
  border-radius: 8px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
  max-width: 600px;
  width: 90%;
  max-height: 80vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.modal-header {
  padding: 1.5rem;
  border-bottom: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.modal-header h2 {
  margin: 0;
  font-size: 1.3rem;
}

.modal-close {
  background: none;
  border: none;
  font-size: 2rem;
  cursor: pointer;
  color: var(--text-secondary);
  padding: 0;
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  transition: background 0.2s;
}

.modal-close:hover {
  background: var(--panel-soft);
}

.modal-body {
  padding: 1.5rem;
  overflow-y: auto;
  flex: 1;
}

.modal-footer {
  padding: 1rem 1.5rem;
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
}

/* Generation Options */
.generation-options {
  margin-bottom: 1.5rem;
}

.option-group {
  margin-bottom: 1rem;
  padding: 1rem;
  background: var(--panel-soft);
  border-radius: 6px;
}

.option-group label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 500;
  cursor: pointer;
}

.option-group input[type="radio"] {
  margin: 0;
}

.option-details {
  margin-top: 0.75rem;
  padding-left: 1.5rem;
  transition: all 0.2s;
}

.option-details.hidden {
  display: none;
}

.option-details select,
.option-details input {
  width: 100%;
  padding: 0.5rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--panel);
  color: var(--text);
  font-family: inherit;
}

/* Checkboxes */
.checkbox-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  max-height: 200px;
  overflow-y: auto;
  padding: 0.5rem 0;
}

.check-all {
  font-weight: 600;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--border);
  margin-bottom: 0.5rem;
}

.contract-checkboxes label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.25rem 0;
  cursor: pointer;
}

.contract-checkboxes input[type="checkbox"] {
  margin: 0;
}

/* Generation Settings */
.generation-settings {
  margin-bottom: 1rem;
  padding: 1rem;
  background: var(--bg-secondary);
  border-radius: 6px;
}

.generation-settings h3 {
  margin-top: 0;
  margin-bottom: 0.75rem;
  font-size: 0.95rem;
}

.generation-settings label {
  display: block;
  margin-bottom: 0.75rem;
  font-weight: 500;
}

.generation-settings .hint {
  font-size: 0.85rem;
  color: var(--text-secondary);
  margin-left: 0.25rem;
}

.full-width {
  width: 100% !important;
  padding: 0.5rem;
  border: 1px solid var(--border-color);
  border-radius: 4px;
  background: var(--bg-primary);
  color: var(--text-primary);
  font-family: inherit;
}

/* Progress Bar */
.generation-progress {
  margin-bottom: 1rem;
  padding: 1rem;
  background: var(--bg-secondary);
  border-radius: 6px;
}

.generation-progress.hidden {
  display: none;
}

.progress-bar {
  height: 6px;
  background: var(--border-color);
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 0.5rem;
}

.progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #4CAF50, #45a049);
  width: 0%;
  animation: progress-animation 2s ease-in-out infinite;
  border-radius: 3px;
}

@keyframes progress-animation {
  0%, 100% { width: 0%; }
  50% { width: 70%; }
}

#progressText {
  margin: 0;
  font-size: 0.9rem;
  text-align: center;
  color: var(--text-secondary);
}

/* Result */
.generation-result {
  padding: 1rem;
  background: var(--bg-secondary);
  border-radius: 6px;
  border: 2px solid var(--border-color);
}

.generation-result.hidden {
  display: none;
}

.success-box {
  color: #4CAF50;
}

.success-box h3 {
  margin-top: 0;
  margin-bottom: 0.5rem;
}

.success-box p {
  margin: 0.25rem 0;
  font-size: 0.95rem;
}

.error-box {
  color: #f44336;
}

.error-box h3 {
  margin-top: 0;
  margin-bottom: 0.5rem;
}

.error-box p {
  margin: 0.25rem 0;
  font-size: 0.95rem;
  white-space: pre-wrap;
  word-break: break-word;
}

/* Buttons in modal */
.modal-footer button {
  padding: 0.5rem 1rem;
  border-radius: 4px;
  border: none;
  cursor: pointer;
  font-weight: 500;
  transition: all 0.2s;
}

.modal-footer .primary {
  background: #4CAF50;
  color: white;
}

.modal-footer .primary:hover:not(:disabled) {
  background: #45a049;
}

.modal-footer .primary:disabled {
  background: #cccccc;
  cursor: not-allowed;
}

.modal-footer .secondary {
  background: var(--bg-secondary);
  color: var(--text-primary);
  border: 1px solid var(--border-color);
}

.modal-footer .secondary:hover {
  background: var(--border-color);
}

/* Input with button */
.input-with-button {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}

.input-with-button input {
  flex: 1;
  padding: 0.5rem;
  border: 1px solid var(--border-color);
  border-radius: 4px;
  background: var(--bg-primary);
  color: var(--text-primary);
  font-family: inherit;
}

.input-with-button button {
  padding: 0.5rem 0.75rem;
  border-radius: 4px;
  border: 1px solid var(--border-color);
  background: var(--bg-secondary);
  color: var(--text-primary);
  cursor: pointer;
  font-size: 1rem;
  transition: all 0.2s;
}

.input-with-button button:hover {
  background: var(--border-color);
}

/* Contract Warnings */
.contract-warnings {
  margin-bottom: 1rem;
  padding: 1rem;
  background: #fff3cd;
  border: 1px solid #ffc107;
  border-radius: 6px;
  color: #856404;
}

.contract-warnings.hidden {
  display: none;
}

.contract-warnings h3 {
  margin-top: 0;
  margin-bottom: 0.5rem;
  font-size: 0.95rem;
  color: #856404;
}

.contract-warnings ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.contract-warnings li {
  margin: 0.25rem 0;
  font-size: 0.9rem;
  padding-left: 1.5rem;
  position: relative;
}

.contract-warnings li:before {
  content: "⚠️";
  position: absolute;
  left: 0;
}

/* Setting row */
.setting-row {
  margin-bottom: 0.75rem;
}

/* Responsive */
@media (max-width: 768px) {
  .modal-content {
    width: 95%;
    max-height: 90vh;
  }

  .checkbox-list {
    max-height: 150px;
  }

  .input-with-button {
    flex-direction: column;
  }

  .input-with-button button {
    width: 100%;
  }
}




/* ========================================================================
   V1.34.1 — Correctif échanges compacts + sélecteurs horaires Firefox
   ======================================================================== */

/* Accessibilité : texte lisible par lecteurs d'écran, invisible à l'écran. */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Icônes SVG indépendantes de la police système : évite le ✎ rendu en antislash. */
.icon-mini {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 30px;
  padding: 0 8px;
  border-radius: 8px;
  line-height: 1;
}

.icon-mini .icon-svg {
  width: 15px;
  height: 15px;
  stroke: currentColor;
  stroke-width: 1.9;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex: 0 0 auto;
}

/* Sélecteurs heure/minute : pas figé à 10 minutes, stable dans Firefox. */
.time-select-pair {
  display: inline-grid;
  grid-template-columns: minmax(58px, 1fr) auto minmax(58px, 1fr);
  align-items: center;
  gap: 4px;
  width: 100%;
  min-width: 132px;
}

.time-select-pair select,
.time-select {
  width: 100%;
  min-width: 0;
  font-family: var(--font-mono);
  text-align: center;
  text-align-last: center;
}

.time-select-separator {
  color: var(--text-muted);
  font-family: var(--font-mono);
  font-weight: 700;
  padding: 0 1px;
}

.reminder-edit-grid.with-time,
.reminder-edit-inline,
.townhall-reminder-grid {
  display: grid;
  grid-template-columns: minmax(130px, 0.8fr) minmax(132px, 0.8fr) minmax(180px, 1fr) minmax(220px, 1.4fr);
  gap: 8px;
  align-items: center;
}

.inline-form .time-select-pair {
  min-width: 0;
}

@media (max-width: 980px) {
  .reminder-edit-grid.with-time,
  .reminder-edit-inline,
  .townhall-reminder-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 620px) {
  .reminder-edit-grid.with-time,
  .reminder-edit-inline,
  .townhall-reminder-grid {
    grid-template-columns: 1fr;
  }
}

/* Historique d'échange compact : proche du rendu visé, mais lisible dans le panneau 1/3. */
.exchange-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 8px 0 10px;
}

.exchange-item,
.note-item.exchange-item {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 10px;
  align-items: stretch;
  padding: 8px;
  background: var(--panel-soft, #f8fafc);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: var(--shadow-xs, none);
}

.exchange-date-box,
.note-date.exchange-date-box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  padding: 7px 8px;
  border-radius: 10px;
  background: var(--panel, #fff);
  border: 1px solid var(--border);
  min-width: 0;
}

.exchange-date-box strong {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-strong);
  white-space: nowrap;
}

.exchange-date-box span {
  color: var(--text-muted);
  font-size: 11px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.exchange-content,
.note-content.exchange-content {
  position: relative;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
}

.exchange-text {
  color: var(--text-primary);
  font-size: 13px;
  line-height: 1.35;
  white-space: pre-wrap;
  word-break: break-word;
  padding-right: 70px;
}

.exchange-actions {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  gap: 4px;
}

.exchange-edit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}

.contract-section textarea[id^="newNoteText"],
.contract-section textarea[id^="newOpExchangeText"] {
  min-height: 70px;
}

html[data-theme="dark"] .exchange-item,
html[data-theme="dark"] .note-item.exchange-item {
  background: color-mix(in srgb, var(--panel) 86%, white 2%);
}

@media (max-width: 760px) {
  .exchange-item,
  .note-item.exchange-item {
    grid-template-columns: 1fr;
  }

  .exchange-date-box,
  .note-date.exchange-date-box {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
  }
}

/* ========================================================================
   V1.34.2 — Refonte visuelle fiche propriétaire / contrat foncier
   Objectif : fiche latérale plus lisible, proche du mockup ergonomique.
   ======================================================================== */

.contract-detail-panel.contract-sheet-v1342 {
  width: min(1180px, 74vw);
  padding: 24px 28px 32px;
  background:
    radial-gradient(circle at 0 0, color-mix(in srgb, var(--accent) 12%, transparent), transparent 320px),
    var(--panel);
  border-left: 1px solid var(--border);
  box-shadow: -18px 0 45px rgba(15, 23, 42, .12);
}

.contract-detail-panel.contract-sheet-v1342.fullscreen {
  width: calc(100vw - var(--sidebar-w));
}

.contract-sheet-v1342 .contract-sheet-header-v1342 {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border-soft);
}

.contract-title-zone-v1342 {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.contract-avatar-v1342 {
  width: 58px;
  height: 58px;
  flex: 0 0 58px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--accent-soft), color-mix(in srgb, var(--accent) 24%, white));
  color: var(--accent-dark);
  font: 800 18px/1 var(--font-sans);
  border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
}

.contract-title-copy-v1342 { min-width: 0; }

.contract-title-line-v1342 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.contract-title-line-v1342 h3 {
  margin: 0;
  font-family: var(--font-sans);
  font-size: clamp(18px, 1.35vw, 24px);
  line-height: 1.15;
  letter-spacing: -0.025em;
  color: var(--text-strong);
}

.contract-title-copy-v1342 .meta {
  margin-top: 5px;
  font-size: 13px;
}

.contract-actions-v1342 {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  margin: 0;
}

.contract-actions-v1342 button {
  min-height: 38px;
  border-radius: 8px;
  padding: 0 13px;
  font-weight: 700;
  white-space: nowrap;
}

.contract-actions-v1342 .danger {
  display: inline-flex;
  gap: 7px;
  align-items: center;
}

.contract-actions-v1342 .icon-svg,
.contract-sheet-v1342 .icon-svg {
  width: 16px;
  height: 16px;
  stroke: currentColor;
  stroke-width: 1.9;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex: 0 0 auto;
}

.contract-kpi-strip-v1342,
.contract-top-royalty-info.contract-kpi-strip-v1342 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 14px;
}

.contract-kpi-card-v1342 {
  min-height: 82px;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 12px;
  align-items: center;
  padding: 14px 16px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .035);
}

.contract-kpi-icon-v1342 {
  grid-row: 1 / span 2;
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent) 16%, transparent);
  color: var(--accent-dark);
}

.contract-kpi-label-v1342 {
  align-self: end;
  color: var(--text-muted);
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 700;
}

.contract-kpi-card-v1342 strong {
  align-self: start;
  display: block;
  margin-top: 4px;
  color: var(--text-strong);
  font-family: var(--font-sans);
  font-size: 20px;
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.contract-status-card-v1342 {
  display: grid;
  grid-template-columns: minmax(170px, auto) minmax(260px, 1fr);
  gap: 12px;
  align-items: center;
  margin-bottom: 14px;
  padding: 12px 14px;
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: 12px;
}

.contract-status-card-v1342 label {
  margin: 0;
  color: var(--text-strong);
  font-size: 13px;
}

.contract-status-card-v1342 .status-select {
  margin: 0;
  min-height: 40px;
  background: var(--panel);
  border-radius: 8px;
}

.contract-section-card-v1342,
.contract-sheet-v1342 .contract-operators-section {
  margin-top: 14px;
  padding: 16px;
  background: color-mix(in srgb, var(--panel) 96%, var(--accent) 4%);
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .025);
}

.contract-sheet-v1342 .contract-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.contract-sheet-v1342 .contract-section h3,
.contract-sheet-v1342 .contract-operators-section h3 {
  margin: 0;
  color: var(--text-strong);
  font-family: var(--font-sans);
  font-size: 16px;
  letter-spacing: -0.01em;
  text-transform: none;
}

.contract-sheet-v1342 .section-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.contract-sheet-v1342 .icon-action,
.contract-sheet-v1342 .row-action,
.contract-sheet-v1342 .contact-actions-v1342 button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 34px;
  border-radius: 8px;
  font-weight: 700;
}

.contract-sheet-v1342 .icon-action {
  background: var(--panel);
  border: 1px solid var(--border);
  color: var(--text);
}

.contract-sheet-v1342 .icon-action.active,
.contract-sheet-v1342 .icon-action:hover {
  background: color-mix(in srgb, var(--accent) 14%, transparent);
  border-color: color-mix(in srgb, var(--accent) 45%, transparent);
  color: var(--accent-dark);
}

.contract-contact-grid-v1342 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(310px, 520px));
  gap: 12px;
}

.contact-card-v1342 {
  padding: 14px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: none;
}

.contact-identity-v1342 {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  margin-bottom: 12px;
}

.contact-main-icon-v1342 {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  color: var(--accent-dark);
}

.contact-card-v1342 h4 {
  margin: 0 0 5px;
  font-family: var(--font-sans);
  font-size: 15px;
  letter-spacing: -0.01em;
}

.contact-role-pill-v1342 {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-dark);
  font-size: 11px;
  font-weight: 800;
}

.contact-details-v1342 {
  display: grid;
  gap: 8px;
}

.contact-details-v1342 > div {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.35;
}

.contact-details-v1342 .icon-svg {
  width: 15px;
  height: 15px;
  margin-top: 1px;
  color: var(--text-muted);
}

.contact-actions-v1342 {
  margin-top: 12px;
  display: flex;
  justify-content: flex-end;
}

.contact-actions-v1342 button {
  min-width: 94px;
  background: var(--panel);
  border: 1px solid color-mix(in srgb, var(--accent) 40%, var(--border));
  color: var(--accent-dark);
}

.exchange-add-box-v1342 {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.exchange-add-box-v1342 textarea {
  width: 100%;
  min-height: 78px;
  resize: vertical;
  background: var(--panel);
  border-radius: 10px;
}

.exchange-add-box-v1342 button {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border-radius: 8px;
}

.exchange-timeline-v1342 {
  position: relative;
  gap: 8px;
  margin-left: 10px;
  padding-left: 16px;
}

.exchange-timeline-v1342::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 18px;
  bottom: 18px;
  width: 2px;
  background: color-mix(in srgb, var(--accent) 45%, transparent);
  border-radius: 999px;
}

.exchange-row-v1342,
.note-item.exchange-row-v1342 {
  position: relative;
  grid-template-columns: minmax(168px, .65fr) minmax(0, 1.9fr);
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: none;
}

.exchange-row-v1342::before {
  content: "";
  position: absolute;
  left: -21px;
  top: 50%;
  width: 9px;
  height: 9px;
  transform: translateY(-50%);
  border-radius: 999px;
  background: var(--accent-dark);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent);
}

.exchange-row-v1342 .exchange-date-box {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 8px;
  padding: 0;
  background: transparent;
  border: 0;
}

.exchange-row-v1342 .exchange-icon-v1342 {
  grid-row: 1 / span 2;
  align-self: center;
  color: var(--accent-dark);
}

.exchange-row-v1342 .exchange-date-box strong {
  font-size: 12px;
  color: var(--text-strong);
}

.exchange-row-v1342 .exchange-date-box span:not(.exchange-icon-v1342) {
  font-size: 12px;
  color: var(--text-muted);
}

.exchange-row-v1342 .exchange-text {
  padding-right: 76px;
  font-size: 13px;
  line-height: 1.45;
}

.exchange-row-v1342 .exchange-actions {
  top: 50%;
  transform: translateY(-50%);
}

.empty-state-v1342 {
  padding: 12px;
  background: var(--panel);
  border: 1px dashed var(--border-strong);
  border-radius: 10px;
}

.reminders-list-v1342 {
  display: grid;
  gap: 8px;
  margin-bottom: 10px;
}

.reminder-card-v1342,
.reminder-final-card.reminder-card-v1342 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 12px;
}

.reminder-info-v1342 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.reminder-icon-v1342 {
  display: inline-flex;
  color: var(--accent-dark);
}

.contract-sheet-v1342 .reminder-date-pill {
  padding: 4px 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  color: var(--accent-dark);
  font-weight: 800;
  font-size: 11px;
}

.contract-sheet-v1342 .reminder-card-note-inline {
  color: var(--text-muted);
  font-size: 12px;
}

.add-reminder-box-v1342 {
  margin-top: 10px;
  padding: 12px;
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: 12px;
}

.add-reminder-box-v1342 .reminder-edit-grid.with-time {
  grid-template-columns: minmax(130px, .75fr) minmax(135px, .7fr) minmax(190px, 1fr) minmax(240px, 1.35fr);
}

.add-reminder-box-v1342 label {
  display: flex;
  flex-direction: column;
  gap: 5px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 800;
}

.add-reminder-box-v1342 label span {
  color: var(--text-subtle);
  font-weight: 600;
}

.add-reminder-box-v1342 input,
.add-reminder-box-v1342 select,
.add-reminder-box-v1342 .time-select-pair select {
  min-height: 38px;
  border-radius: 8px;
  background: var(--panel);
  font-size: 13px;
}

.add-reminder-box-v1342 .reminder-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 10px;
}

.add-reminder-box-v1342 .reminder-actions button {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  border-radius: 8px;
}

.parcel-table-wrap-v1342 {
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--panel);
}

.contract-sheet-v1342 table.parcels-table-v1342 {
  margin: 0;
  border-collapse: separate;
  border-spacing: 0;
  min-width: 1180px;
}

.parcels-table-v1342 th {
  background: var(--panel-soft);
  white-space: nowrap;
  vertical-align: middle;
}

.parcels-table-v1342 td {
  background: var(--panel);
  vertical-align: middle;
}

.parcels-table-v1342 .parcel-group-head {
  text-align: center;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--text-secondary);
}

.parcels-table-v1342 .parcel-rp-col {
  text-align: center;
}

.parcel-rp-input {
  width: 74px;
  min-height: 34px;
  padding: 6px 8px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--panel-soft);
  color: var(--text);
  text-align: center;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
}

.parcel-rp-num .parcel-rp-input {
  width: 58px;
}

.parcel-rp-cabling {
  min-width: 118px;
}

.parcel-rp-cabling .parcel-rp-input {
  width: 62px;
  margin-right: 6px;
}

.parcel-rp-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  cursor: pointer;
}

.parcel-rp-check input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.parcel-rp-check span {
  width: 22px;
  height: 22px;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--panel-soft);
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}

.parcel-rp-check input:checked + span {
  border-color: color-mix(in srgb, var(--success) 55%, var(--border));
  background: color-mix(in srgb, var(--success) 18%, var(--panel));
  color: var(--success);
}

.parcel-rp-check input:checked + span::after {
  content: "✓";
  display: block;
  font-size: 17px;
  line-height: 20px;
  font-weight: 900;
}

.parcel-rp-input:focus-visible,
.parcel-rp-check input:focus-visible + span {
  outline: 2px solid color-mix(in srgb, var(--accent) 55%, transparent);
  outline-offset: 2px;
}

.parcel-total-row-v1342 td {
  background: color-mix(in srgb, var(--warning-soft) 55%, var(--panel));
}

.contract-sheet-v1342 .status-badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 24px;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
}

.contract-sheet-v1342 .status-badge::before {
  content: "";
  width: 7px;
  height: 7px;
  margin-right: 6px;
  border-radius: 999px;
  background: currentColor;
}

html[data-theme="dark"] .contract-detail-panel.contract-sheet-v1342 {
  background:
    radial-gradient(circle at 0 0, color-mix(in srgb, var(--accent) 14%, transparent), transparent 320px),
    var(--panel);
  box-shadow: -18px 0 45px rgba(0, 0, 0, .42);
}

html[data-theme="dark"] .contract-avatar-v1342,
html[data-theme="dark"] .contract-kpi-icon-v1342,
html[data-theme="dark"] .contact-main-icon-v1342 {
  background: color-mix(in srgb, var(--accent) 18%, transparent);
  color: var(--accent);
}

html[data-theme="dark"] .contact-role-pill-v1342,
html[data-theme="dark"] .contract-sheet-v1342 .reminder-date-pill {
  background: color-mix(in srgb, var(--accent) 18%, transparent);
  color: var(--accent);
}

@media (max-width: 1380px) {
  .contract-detail-panel.contract-sheet-v1342 {
    width: min(980px, 78vw);
  }
  .contract-kpi-strip-v1342,
  .contract-top-royalty-info.contract-kpi-strip-v1342 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1280px) {
  .contract-sheet-v1342 table.parcels-table-v1342 {
    min-width: 760px;
  }
  .parcels-table-v1342 .parcel-rp-col {
    display: none;
  }
}

@media (max-width: 980px) {
  .contract-detail-panel.contract-sheet-v1342 {
    width: 100vw;
    padding: 18px;
  }
  .contract-sheet-v1342 .contract-sheet-header-v1342 {
    flex-direction: column;
  }
  .contract-actions-v1342 {
    justify-content: flex-start;
  }
  .contract-status-card-v1342,
  .add-reminder-box-v1342 .reminder-edit-grid.with-time {
    grid-template-columns: 1fr;
  }
  .exchange-row-v1342,
  .note-item.exchange-row-v1342 {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .contract-kpi-strip-v1342,
  .contract-top-royalty-info.contract-kpi-strip-v1342 {
    grid-template-columns: 1fr;
  }
  .contract-title-zone-v1342 {
    align-items: flex-start;
  }
  .contract-avatar-v1342 {
    width: 46px;
    height: 46px;
    flex-basis: 46px;
    font-size: 15px;
  }
}

/* === V1.34.3 — Vue contrats fonciers : une ligne = un contrat, sans chevauchement === */
.contracts-export-mode {
  overflow: hidden;
}

.contracts-full-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
  overflow: hidden;
}

.contract-compact-row-wrap {
  min-width: 0;
  width: 100%;
}

.contract-compact-row {
  grid-template-columns: minmax(120px, 150px) minmax(240px, 1.15fr) minmax(280px, 1.75fr) minmax(210px, 0.9fr);
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

.contract-compact-row.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  border-left: 3px solid var(--accent);
}

.contract-compact-row > * {
  min-width: 0;
}

.contract-compact-statuses,
.contract-compact-name,
.contract-compact-parcels,
.contract-compact-meta {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

.contract-compact-name {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.contract-compact-name strong,
.contract-compact-name small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contract-compact-name strong {
  font-family: var(--font-sans);
  font-weight: 800;
  color: var(--text-strong);
}

.contract-compact-name small {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--text-muted);
  letter-spacing: 0.02em;
}

.contract-compact-parcels,
.contract-compact-meta {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contract-compact-meta {
  text-align: right;
}

.contracts-export-toolbar {
  min-width: 0;
  overflow: hidden;
}

.contracts-export-toolbar .owners-export-left,
.contracts-export-toolbar .owners-export-actions,
.contracts-export-toolbar .owner-status-export-filters {
  min-width: 0;
}

@media (max-width: 1280px) {
  .contract-compact-row {
    grid-template-columns: minmax(110px, 135px) minmax(200px, 1.05fr) minmax(220px, 1.5fr) minmax(170px, 0.85fr);
    gap: var(--sp-3);
  }
}

@media (max-width: 1024px) {
  .contract-compact-row {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--sp-2);
  }
  .contract-compact-meta {
    text-align: left;
  }
}

/* ========================================================================== 
   V1.34.6 — Netteté générale / lisibilité écran PC pro
   --------------------------------------------------------------------------
   Objectif : supprimer l'effet visuel "flou" perçu sur le dashboard.
   Causes probables corrigées :
   - police monospace trop présente et trop petite ;
   - contrastes secondaires trop faibles ;
   - letter-spacing excessif sur petits textes ;
   - will-change/transform sur cartes, qui peut rasteriser le texte et le rendre flou ;
   - hiérarchie visuelle trop fine sur les widgets.
   ========================================================================== */

:root {
  /* Texte plus net, moins "terminal", plus applicatif métier */
  --font-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "Cascadia Mono", "SF Mono", Consolas, "Courier New", monospace;

  /* Légère hausse des tailles : améliore netteté à 100% comme à 125% Windows */
  --fs-xs: 11px;
  --fs-sm: 13px;
  --fs-base: 14px;
  --fs-md: 15px;
  --fs-lg: 18px;
  --fs-xl: 24px;
  --fs-2xl: 28px;

  /* Contrastes renforcés */
  --text: #111827;
  --text-strong: #0b1014;
  --text-secondary: #3f4b52;
  --text-muted: #5b6870;
  --text-subtle: #7b878d;
  --muted: #5b6870;

  /* Bordures un peu plus franches pour éviter l'effet délavé */
  --border: #dce5e7;
  --border-soft: #e8eef0;
  --border-strong: #bfcbd0;

  /* Cartes plus lisibles sans effet de flou GPU */
  --shadow-sm: 0 1px 2px rgba(16, 24, 40, .04);
  --shadow-md: 0 4px 12px rgba(16, 24, 40, .06);
  --shadow-lg: 0 10px 24px rgba(16, 24, 40, .08);

  /* Rayons plus modernes, cohérents avec les fiches refondues */
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 10px;
  --r-xl: 12px;
  --r-2xl: 16px;
}

body {
  font-family: var(--font-base);
  font-size: var(--fs-base);
  line-height: 1.48;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
  font-feature-settings: "kern" 1, "tnum" 1;
}

/* Réduction du style "terminal" : plus net sur écran bureautique */
h1,
h2,
h3,
h4,
.topbar h1,
.topbar .subtitle,
.board-card h3,
.board-card-title h3,
.card-head h3,
.card-title h3,
.widget-head h3,
.widget-title-wrap h3,
.dashboard-contracts-card h3,
.financial-widget h3,
.dashboard-map-card h3,
.dashboard-reminders-card h3,
.mayor-card h3,
.news-card-preview h3,
.weather-card h3,
.nav-widget-title {
  font-family: var(--font-sans);
  letter-spacing: -0.01em;
  text-transform: none;
}

.topbar h1,
.dashboard-contracts-card h3,
.financial-widget h3,
.dashboard-map-card h3,
.dashboard-reminders-card h3,
.mayor-card h3,
.news-card-preview h3,
.weather-card h3,
.nav-widget-title {
  font-size: 17px;
  font-weight: 800;
  color: var(--text-strong);
}

.widget-title-wrap h3,
.card-title h3,
.board-card-title h3 {
  color: var(--text-strong);
}

/* Labels : moins espacés, donc moins vibrants/flous */
.gf-label,
.section-label,
.card-label,
.diagnostic h3,
.project-menu-title,
.filter-block h4,
.financial-kpi-grid span,
.foncier-kpi-line span:not(.foncier-kpi-icon),
.reminder-total span,
.reminder-total .meta,
.next-reminder .meta,
.widget-hint,
.watch-preview-kpis span,
.owner-status-mini,
.status-pill,
.status-mini {
  letter-spacing: .025em;
  text-transform: none;
  font-family: var(--font-sans);
}

/* Méta / sous-titres : plus lisibles */
.subtitle,
.meta,
.muted,
.dashboard-contracts-card .meta,
.financial-widget .meta,
.dashboard-map-card .nav-widget-desc,
.dashboard-reminders-card .meta,
.mayor-card .meta,
.news-card-preview .meta,
.weather-card .meta,
.contract-compact-parcels,
.contract-compact-meta,
.owner-compact-parcels,
.owner-compact-meta {
  color: var(--text-secondary);
  font-size: 12.5px;
}

/* Désactivation de la rasterisation GPU qui peut rendre le texte flou */
.dashboard-contracts-card,
.financial-widget,
.dashboard-map-card,
.dashboard-reminders-card,
.mayor-card,
.news-card-preview,
.weather-card,
.board-card,
.nav-widget,
.townhall-card,
.reminder-card,
.history-card,
.import-card,
.project-card {
  will-change: auto;
  transform: none;
  box-shadow: var(--shadow-sm);
}

.dashboard-contracts-card:hover,
.financial-widget:hover,
.dashboard-map-card:hover,
.dashboard-reminders-card:hover,
.mayor-card:hover,
.news-card-preview:hover,
.weather-card:hover,
.board-card:hover,
.nav-widget:hover,
.townhall-card:hover,
.reminder-card:hover,
.history-card:hover,
.import-card:hover,
.project-card:hover {
  transform: none;
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
  box-shadow: var(--shadow-md);
}

/* KPI : valeurs plus franches, labels plus lisibles */
.foncier-ring-value,
.foncier-kpi-line strong,
.financial-kpi-grid strong,
.reminder-total strong,
.next-reminder > strong:first-child,
.kpi-tile strong {
  color: var(--text-strong);
  font-weight: 800;
  letter-spacing: -0.015em;
}

.foncier-ring-value {
  font-size: 32px;
}

.foncier-ring-label,
.foncier-kpi-line span:not(.foncier-kpi-icon),
.financial-kpi-grid span,
.kpi-tile span {
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 650;
}

/* Cartes : moins plates, plus distinctes sans forcer l'œil */
.dashboard-contracts-card,
.financial-widget,
.dashboard-map-card,
.dashboard-reminders-card,
.mayor-card,
.news-card-preview,
.weather-card,
.board-card,
.nav-widget {
  border-color: var(--border);
  background: #ffffff;
}

/* Boutons : police plus nette et plus cohérente */
button,
.btn,
select,
input,
textarea {
  font-family: var(--font-sans);
  font-weight: 600;
}

input,
select,
textarea {
  color: var(--text-strong);
}

input::placeholder,
textarea::placeholder {
  color: #8a969c;
}

/* Liste contrats : meilleure lecture horizontale */
.contract-compact-name strong,
.owner-compact-name,
.contract-row strong,
.owner-row strong {
  font-family: var(--font-sans);
  font-size: 13.5px;
  font-weight: 800;
}

.contract-compact-name small,
.contract-compact-parcels,
.contract-compact-meta,
.owner-compact-parcels,
.owner-compact-meta {
  font-family: var(--font-sans);
  letter-spacing: 0;
}

.contract-compact-row,
.owner-compact-row,
.contract-row,
.owner-row {
  border-color: var(--border);
}

/* Feuille / fiche propriétaire : conserve le nouveau visuel mais augmente la lisibilité */
.contract-header-v1342 h2,
.contract-title-zone-v1342 h2,
.fiche-contrat-section h3,
.contract-section-card h3 {
  font-family: var(--font-sans);
  color: var(--text-strong);
  letter-spacing: -0.01em;
}

.contract-subtitle-v1342,
.contract-contact-line,
.fiche-contrat-section p,
.contract-section-card p {
  color: var(--text-secondary);
}

/* Carte : affichage normal des tuiles ; pas de filtre ou compression artificielle */
.leaflet-container,
.leaflet-tile,
.dashboard-map-preview img {
  image-rendering: auto;
  filter: none;
}


/* ========================================================================== 
   V1.34.8 — Thème dark/light cohérent + carte acteurs/statuts
   --------------------------------------------------------------------------
   - Suppression de la légende basse de carte.
   - Colonne gauche réservée aux propriétaires / exploitants.
   - Les statuts fonciers sont pilotés depuis le contrôle des couches Leaflet.
   - Harmonisation dark/light : plus de cartes dashboard forcées en blanc/noir pur.
   ========================================================================== */

/* Variables complémentaires */
:root {
  --surface-card: var(--panel);
  --surface-card-soft: var(--panel-soft);
  --text-on-card: var(--text);
  --map-control-bg: var(--panel);
}

html[data-theme="dark"] {
  --surface-card: var(--panel);
  --surface-card-soft: var(--panel-soft);
  --text-on-card: var(--text);
  --map-control-bg: var(--panel-elevated);
}

/* Correctif global cartes : pas de couleur figée en fin de fichier */
.dashboard-contracts-card,
.financial-widget,
.dashboard-map-card,
.dashboard-reminders-card,
.mayor-card,
.news-card-preview,
.weather-card,
.board-card,
.nav-widget,
.contracts-list-panel,
.contract-detail-panel,
.map-filters,
.map-wrap,
.cards > .card,
.card,
.muted-box {
  background: var(--surface-card);
  color: var(--text-on-card);
  border-color: var(--border);
}

.foncier-kpi-line,
.foncier-clean-kpis .kpi,
.financial-kpi-grid > div,
.next-reminder,
.reminder-card,
.kpi-tile,
.stat-strip,
.import-summary-box,
.project-card,
.contract-section-card,
.fiche-contrat-section,
.contract-contact-card-v1342,
.contract-kpi-card-v1342 {
  background: var(--surface-card-soft);
  color: var(--text-on-card);
  border-color: var(--border);
}

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
  background: var(--panel-elevated);
  color: var(--text-strong);
  border-color: var(--border-strong);
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
  color: var(--text-subtle);
}

html[data-theme="dark"] button:not(.primary):not(.danger),
html[data-theme="dark"] .btn:not(.primary):not(.danger) {
  background: var(--panel-elevated);
  color: var(--text);
  border-color: var(--border-strong);
}

/* Carte : nouvelle séparation responsabilités */
.map-page-v1348 {
  grid-template-columns: minmax(300px, 360px) minmax(0, 1fr);
}

.map-actors-panel h3 {
  margin-bottom: 4px;
  color: var(--text-strong);
}

.map-actors-panel .map-filter-help {
  margin: 0 0 var(--sp-3);
  padding-bottom: var(--sp-3);
  border-bottom: 1px solid var(--border);
}

.map-page-v1348 .filter-block:first-of-type {
  padding-top: 0;
  margin-top: 0;
  border-top: none;
}

.map-page-v1348 .map-contract-filter-panel,
.map-page-v1348 .operator-filter-block {
  display: block;
}

.map-page-v1348 .owner-checks {
  max-height: 250px;
  padding-right: 4px;
}

.map-cache-status-inline {
  position: absolute;
  left: var(--sp-3);
  bottom: var(--sp-3);
  z-index: 650;
  max-width: min(620px, calc(100% - 24px));
  margin: 0;
  background: color-mix(in srgb, var(--panel) 92%, transparent);
  color: var(--text-secondary);
  backdrop-filter: blur(4px);
  box-shadow: var(--shadow-md);
}

/* Ancienne légende volontairement désactivée */
.legend,
#mapLegend {
  display: none;
}

/* Contrôle Leaflet plus lisible et thème-compatible */
.leaflet-control-layers {
  background: var(--map-control-bg) !important;
  border: 1px solid var(--border-strong) !important;
  border-radius: var(--r-lg) !important;
  box-shadow: var(--shadow-md) !important;
  color: var(--text) !important;
}

.leaflet-control-layers-expanded {
  min-width: 220px;
  padding: 10px 12px !important;
}

.leaflet-control-layers label {
  display: flex !important;
  align-items: center;
  gap: 8px;
  min-height: 26px;
  color: var(--text) !important;
  font-family: var(--font-sans);
  font-size: 12.5px;
}

.leaflet-control-layers input {
  margin: 0;
  accent-color: var(--accent);
}

.leaflet-control-layers-separator {
  border-top-color: var(--border) !important;
  margin: 8px 0 !important;
}

html[data-theme="dark"] .leaflet-control-layers-toggle {
  filter: invert(1) opacity(.86);
}

/* Tuiles : on garde la carte lisible en dark, mais sans inversion destructrice */
html[data-theme="dark"] .leaflet-tile-pane {
  filter: brightness(.86) contrast(.96) saturate(.9);
}

html[data-theme="light"] .leaflet-tile-pane,
html:not([data-theme]) .leaflet-tile-pane {
  filter: none;
}

/* Lisibilité des textes secondaires en sombre */
html[data-theme="dark"] .subtitle,
html[data-theme="dark"] .meta,
html[data-theme="dark"] .muted,
html[data-theme="dark"] .dashboard-contracts-card .meta,
html[data-theme="dark"] .financial-widget .meta,
html[data-theme="dark"] .dashboard-map-card .nav-widget-desc,
html[data-theme="dark"] .dashboard-reminders-card .meta,
html[data-theme="dark"] .contract-compact-parcels,
html[data-theme="dark"] .contract-compact-meta,
html[data-theme="dark"] .owner-compact-parcels,
html[data-theme="dark"] .owner-compact-meta {
  color: var(--text-secondary);
}

/* Le mode sombre ne doit plus afficher des widgets blancs par reliquat V1.34.6 */
html[data-theme="dark"] .dashboard-contracts-card,
html[data-theme="dark"] .financial-widget,
html[data-theme="dark"] .dashboard-map-card,
html[data-theme="dark"] .dashboard-reminders-card,
html[data-theme="dark"] .mayor-card,
html[data-theme="dark"] .news-card-preview,
html[data-theme="dark"] .weather-card,
html[data-theme="dark"] .board-card,
html[data-theme="dark"] .nav-widget {
  background: var(--panel);
  color: var(--text);
}

@media (max-width: 1100px) {
  .map-page-v1348 {
    grid-template-columns: 1fr;
  }
  .map-filters {
    position: static;
    max-height: none;
  }
}


/* v1.34.9 — Prévisualisation de la sélection Word */
.generation-selection-preview {
  margin: 0 0 1rem;
  padding: 0.9rem 1rem;
  border: 1px solid var(--border-color);
  border-radius: 12px;
  background: var(--bg-surface-alt);
}
.generation-selection-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.6rem;
}
.generation-selection-head strong {
  color: var(--text-main);
  font-weight: 800;
}
.generation-selection-head span,
.generation-selection-note {
  color: var(--text-muted);
  font-size: 0.85rem;
}
.generation-selection-preview ul,
.generation-files ul {
  margin: 0.5rem 0 0;
  padding-left: 1.2rem;
}
.generation-selection-preview li {
  margin: 0.25rem 0;
}
.generation-selection-preview li span {
  margin-left: 0.5rem;
}
.generation-selection-preview li em {
  margin-left: 0.5rem;
  color: var(--text-muted);
  font-style: normal;
  font-size: 0.85rem;
}
.generation-files {
  margin-top: 0.8rem;
}
.generation-files summary {
  cursor: pointer;
  font-weight: 700;
}


/* ==========================================================================
   V1.34.10 — Carte : switch propriétaires/exploitants + sans contrat masqué
   ========================================================================== */
.map-actor-switch {
  margin: var(--sp-3) 0 var(--sp-4);
}

.map-actor-switch .map-filter-tab {
  min-height: 38px;
  font-weight: 800;
}

.map-page-v1348 .map-contract-filter-panel.hidden,
.map-page-v1348 .operator-filter-block.hidden {
  display: none !important;
}

.map-page-v1348 .operator-filter-block {
  border-top: none;
  margin-top: 0;
  padding-top: 0;
}

.map-page-v1348 .map-contract-filter-panel {
  border-top: none;
  margin-top: 0;
  padding-top: 0;
}

.map-actors-panel .filter-block h4 {
  margin-top: 0;
}

/* ========================================================================
   V1.34.11 — Fiche exploitant agricole harmonisée avec la fiche propriétaire
   ======================================================================== */

.operator-sheet-v13411 {
  width: min(1180px, 74vw);
}

.operator-sheet-v13411.fullscreen {
  width: calc(100vw - var(--sidebar-w));
}

.operator-avatar-v13411 {
  background: color-mix(in srgb, var(--operator-color, var(--accent)) 18%, transparent) !important;
  color: var(--operator-color, var(--accent-dark)) !important;
  border-color: color-mix(in srgb, var(--operator-color, var(--accent)) 35%, transparent) !important;
}

.operator-type-pill-v13411 {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 24px;
  padding: 4px 9px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent) 14%, transparent);
  color: var(--accent-dark);
  font-size: 11px;
  font-weight: 800;
}

.operator-form-grid-v13411 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px 14px;
}

.operator-form-grid-v13411 label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 800;
}

.operator-form-grid-v13411 label > span {
  color: var(--text-secondary);
}

.operator-form-grid-v13411 input,
.operator-form-grid-v13411 select,
.operator-form-grid-v13411 textarea {
  width: 100%;
  min-height: 40px;
  border-radius: 9px;
  background: var(--panel);
  color: var(--text);
  font-size: 14px;
  font-weight: 500;
}

.operator-form-grid-v13411 textarea {
  min-height: 82px;
  resize: vertical;
}

.operator-form-grid-v13411 .span-2 { grid-column: span 2; }
.operator-color-input-v13411 { width: 60px !important; padding: 3px !important; cursor: pointer; }

.operator-save-row-v13411 {
  display: flex;
  justify-content: flex-end;
  margin-top: 12px;
}

.operator-linked-contracts-v13411 {
  display: grid;
  gap: 9px;
  margin-bottom: 12px;
}

.operator-contract-card-v13411 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 12px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-left: 4px solid var(--status-color, var(--accent));
  border-radius: 12px;
}

.operator-contract-main-v13411 {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.operator-contract-main-v13411 strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text-strong);
  font-size: 14px;
}

.operator-contract-main-v13411 span:last-child {
  color: var(--text-muted);
  font-size: 12px;
}

.operator-contract-actions-v13411 {
  display: flex;
  gap: 6px;
  flex: 0 0 auto;
}

.operator-contract-actions-v13411 button {
  min-height: 32px;
  padding: 0 10px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 800;
}

.operator-attach-row-v13411 {
  display: flex;
  gap: 8px;
  align-items: center;
}

.operator-attach-row-v13411 select { flex: 1; min-width: 0; }
.operator-attach-row-v13411 button { white-space: nowrap; }

.operator-card-row-v13411 {
  grid-template-columns: 14px minmax(220px, 1.1fr) minmax(260px, .95fr) minmax(220px, .9fr);
  align-items: center;
  min-height: 58px;
}

.operator-card-main-v13411 {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.operator-card-sub-v13411,
.operator-card-contracts-v13411 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text-muted);
  font-size: 12px;
}

.operator-card-kpis-v13411 {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.operator-card-kpis-v13411 span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 7px;
  border-radius: 999px;
  background: var(--panel-soft);
  color: var(--text-secondary);
  border: 1px solid var(--border-soft);
  font-size: 11px;
}

.operator-card-kpis-v13411 strong {
  color: var(--text-strong);
  font-size: 12px;
}

.operator-sheet-v13411 .note-item.exchange-item {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px 12px;
}

html[data-theme="dark"] .operator-type-pill-v13411 {
  background: color-mix(in srgb, var(--accent) 18%, transparent);
  color: var(--accent);
}

@media (max-width: 1380px) {
  .operator-card-row-v13411 {
    grid-template-columns: 14px minmax(220px, 1.2fr) minmax(180px, .8fr);
  }
  .operator-card-contracts-v13411 { display: none; }
}

@media (max-width: 980px) {
  .operator-sheet-v13411 {
    width: 100vw;
  }
  .operator-form-grid-v13411 {
    grid-template-columns: 1fr;
  }
  .operator-form-grid-v13411 .span-2 { grid-column: auto; }
  .operator-contract-card-v13411,
  .operator-attach-row-v13411 {
    flex-direction: column;
    align-items: stretch;
  }
  .operator-card-row-v13411 {
    grid-template-columns: 14px minmax(0, 1fr);
  }
  .operator-card-kpis-v13411,
  .operator-card-contracts-v13411 { grid-column: 2; }
}

/* V1.34.11 — liste générale exploitants agricoles plus lisible */
.operators-full-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

.operators-full-toolbar > div {
  display: inline-flex;
  gap: 6px;
  align-items: baseline;
  color: var(--text);
}

.operators-compact-list {
  display: grid;
  gap: 8px;
}

.operator-compact-row {
  display: grid;
  gap: var(--sp-3);
  width: 100%;
  padding: var(--sp-3) var(--sp-4);
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  color: var(--text);
  text-align: left;
  cursor: pointer;
  transition: border-color var(--t), background var(--t), box-shadow var(--t);
}

.operator-compact-row:hover,
.operator-compact-row.active {
  border-color: color-mix(in srgb, var(--operator-color, var(--accent)) 55%, var(--border));
  background: color-mix(in srgb, var(--operator-color, var(--accent)) 7%, var(--panel));
  box-shadow: var(--shadow-sm);
}

.operator-compact-color {
  width: 12px;
  height: 12px;
  border-radius: 3px;
  background: var(--operator-color, var(--accent));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--operator-color, var(--accent)) 16%, transparent);
}

.operator-compact-name {
  min-width: 0;
  color: var(--text-strong);
  font-weight: 800;
  font-size: var(--fs-sm);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* V1.34.12 — libellés colorés dans le contrôle de couches Leaflet */
.leaflet-layer-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  line-height: 1.2;
}

.leaflet-layer-swatch {
  width: 11px;
  height: 11px;
  border-radius: 3px;
  flex: 0 0 11px;
  border: 1px solid color-mix(in srgb, var(--text) 20%, transparent);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.18);
}

.leaflet-status-layer-label {
  font-weight: 650;
}

.leaflet-operator-layer-label {
  font-weight: 750;
  color: var(--accent-strong);
}


/* ========================================================================== 
   V1.34.14 — Refonte visuelle page Veille locale (dark/light)
   ========================================================================== */
#view-watch .section-head {
  align-items: center;
  border-bottom: 0;
  margin-bottom: var(--sp-3);
}
#view-watch .section-head h2 {
  font-family: var(--font-sans);
  font-size: var(--fs-xl);
  letter-spacing: -0.02em;
  text-transform: none;
}
#view-watch .section-head .meta { font-family: var(--font-sans); }
#view-watch .watch-head-actions { display: none; }

.watch-page {
  display: block;
  max-width: 1780px;
}
.watch-redesign {
  display: grid;
  gap: var(--sp-4);
  font-family: var(--font-sans);
}
.watch-redesign h2,
.watch-redesign h3,
.watch-redesign p { margin: 0; }
.watch-redesign button,
.watch-redesign input,
.watch-redesign select { font-family: var(--font-sans); }

.watch-hero-card {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(360px, 760px) auto;
  gap: var(--sp-4);
  align-items: center;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: var(--sp-4);
  box-shadow: var(--shadow-md);
}
.watch-hero-title {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  min-width: 0;
}
.watch-hero-icon {
  width: 54px;
  height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border-radius: 16px;
  background: linear-gradient(135deg, var(--accent), var(--accent-dark));
  color: var(--accent-on);
  box-shadow: var(--shadow-sm);
  font-size: 26px;
}
.watch-hero-title h2 {
  color: var(--text-strong);
  font-size: 26px;
  line-height: 1.05;
  letter-spacing: -0.04em;
}
.watch-hero-title p {
  margin-top: 6px;
  color: var(--text-secondary);
  font-size: var(--fs-md);
}
.watch-hero-controls {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 190px auto;
  gap: var(--sp-2);
  align-items: center;
}
.watch-searchbox {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  min-height: 44px;
  padding: 0 var(--sp-3);
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--panel-elevated);
  color: var(--text-muted);
}
.watch-searchbox:focus-within {
  border-color: var(--accent);
  box-shadow: var(--focus-ring);
}
.watch-searchbox input {
  width: 100%;
  min-width: 0;
  border: 0;
  background: transparent;
  padding: 0;
  outline: none;
  color: var(--text);
}
.watch-hero-controls > select,
.watch-add-source-card select,
.watch-add-source-card input,
.watch-keyword-add input {
  min-height: 44px;
  border-radius: 12px;
  background: var(--panel-elevated);
  border: 1px solid var(--border);
  color: var(--text);
}
.watch-refresh-btn { min-height: 44px; border-radius: 12px; }
.watch-hero-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(95px, 1fr));
  gap: var(--sp-2);
}
.watch-kpi-chip {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-areas:
    "dot label"
    "dot value";
  gap: 2px var(--sp-2);
  min-width: 0;
  padding: var(--sp-3);
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--panel-elevated);
  color: var(--text);
  text-align: left;
  box-shadow: var(--shadow-sm);
}
.watch-kpi-chip:hover,
.watch-kpi-chip.active {
  border-color: var(--accent);
  background: var(--accent-soft);
}
.watch-kpi-chip .dot { grid-area: dot; margin-top: 4px; }
.watch-kpi-chip strong {
  grid-area: value;
  color: var(--text-strong);
  font-size: 21px;
  line-height: 1;
}
.watch-kpi-chip em {
  grid-area: label;
  color: var(--text-secondary);
  font-style: normal;
  font-size: var(--fs-sm);
  font-weight: 700;
}
.dot {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: var(--text-muted);
}
.dot-new { background: var(--accent); }
.dot-warn { background: var(--warning); }
.dot-danger { background: var(--danger); }
.dot-muted { background: var(--text-muted); }

.watch-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: var(--sp-4);
  align-items: start;
}
.watch-feed-panel {
  min-width: 0;
}
.watch-feed-tabs {
  display: flex;
  gap: var(--sp-2);
  align-items: center;
  padding: 0 var(--sp-1);
  margin-bottom: var(--sp-3);
  overflow-x: auto;
}
.watch-feed-tabs button {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  padding: 10px 14px;
  border: 0;
  border-bottom: 3px solid transparent;
  border-radius: 12px 12px 0 0;
  background: transparent;
  color: var(--text-secondary);
  font-weight: 700;
}
.watch-feed-tabs button strong {
  min-width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 7px;
  border-radius: 999px;
  background: var(--panel-soft);
  color: var(--text-muted);
  font-size: var(--fs-xs);
}
.watch-feed-tabs button.active {
  color: var(--accent-dark);
  border-bottom-color: var(--accent);
}
html[data-theme="dark"] .watch-feed-tabs button.active { color: var(--accent); }
.watch-feed-tabs button.active strong {
  background: var(--accent);
  color: var(--accent-on);
}
.watch-feed-bar {
  display: flex;
  justify-content: space-between;
  gap: var(--sp-3);
  align-items: center;
  margin-bottom: var(--sp-3);
  color: var(--text-secondary);
  font-size: var(--fs-sm);
}
.watch-feed-count strong { color: var(--text-strong); }
.watch-sort-chip {
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--panel);
  color: var(--text);
  font-weight: 700;
}
.watch-results-redesign {
  display: grid;
  gap: var(--sp-3);
}
.watch-result-card {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr) auto;
  gap: var(--sp-4);
  align-items: start;
  padding: var(--sp-4);
  border: 1px solid var(--border);
  border-radius: 16px;
  background: var(--panel);
  box-shadow: var(--shadow-sm);
  transition: border-color var(--t), box-shadow var(--t), background var(--t);
}
.watch-result-card:hover {
  border-color: var(--accent);
  box-shadow: var(--shadow-lg);
}
.watch-result-status-col {
  display: grid;
  gap: var(--sp-3);
  justify-items: start;
}
.watch-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 86px;
  padding: 7px 10px;
  border-radius: 10px;
  border: 1px solid transparent;
  font-size: var(--fs-xs);
  font-weight: 800;
  color: var(--text);
  background: var(--panel-soft);
}
.watch-status-badge.nouveau {
  background: color-mix(in srgb, var(--accent) 14%, transparent);
  color: var(--accent-dark);
  border-color: color-mix(in srgb, var(--accent) 30%, transparent);
}
.watch-status-badge.vu {
  background: color-mix(in srgb, var(--info) 14%, transparent);
  color: var(--info);
  border-color: color-mix(in srgb, var(--info) 28%, transparent);
}
.watch-status-badge.important {
  background: color-mix(in srgb, var(--warning) 15%, transparent);
  color: var(--warning-strong);
  border-color: color-mix(in srgb, var(--warning) 34%, transparent);
}
.watch-status-badge.archive {
  background: var(--panel-soft);
  color: var(--text-muted);
  border-color: var(--border);
}
.watch-status-badge.bruit {
  background: color-mix(in srgb, var(--danger) 12%, transparent);
  color: var(--danger);
  border-color: color-mix(in srgb, var(--danger) 28%, transparent);
}
.watch-rss-icon {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9px;
  background: var(--panel-soft);
  color: var(--text-muted);
  border: 1px solid var(--border);
  font-size: 14px;
}
.watch-result-body { min-width: 0; }
.watch-result-body h3 {
  margin: 0 0 6px;
  color: var(--text-strong);
  font-size: var(--fs-lg);
  line-height: 1.25;
  letter-spacing: -0.01em;
}
.watch-result-card .watch-result-excerpt {
  margin: 0;
  color: var(--text-secondary);
  font-size: var(--fs-md);
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.watch-result-meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2) var(--sp-3);
  margin-top: var(--sp-2);
  color: var(--text-muted);
  font-size: var(--fs-sm);
}
.watch-result-meta span + span::before {
  content: "•";
  margin-right: var(--sp-3);
  color: var(--border-strong);
}
.watch-result-keywords {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: var(--sp-2);
}
.watch-result-keywords span,
.watch-keywords-redesign span {
  display: inline-flex;
  align-items: center;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent) 9%, transparent);
  color: var(--accent-dark);
  padding: 4px 9px;
  font-size: var(--fs-xs);
  font-weight: 700;
}
html[data-theme="dark"] .watch-result-keywords span,
html[data-theme="dark"] .watch-keywords-redesign span { color: var(--accent); }
.watch-result-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(82px, 1fr));
  gap: var(--sp-2);
  min-width: 220px;
}
.watch-result-actions button,
.watch-source-actions button,
.watch-keyword-add button {
  min-height: 34px;
  padding: 7px 10px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--panel-elevated);
  color: var(--text);
  font-weight: 700;
  font-size: var(--fs-sm);
}
.watch-result-actions button:hover,
.watch-source-actions button:hover,
.watch-keyword-add button:hover {
  border-color: var(--accent);
}
.watch-result-actions .primary-ghost {
  color: var(--accent-dark);
  border-color: color-mix(in srgb, var(--accent) 40%, var(--border));
}
html[data-theme="dark"] .watch-result-actions .primary-ghost { color: var(--accent); }
.watch-result-actions .danger-soft,
.watch-source-actions .danger-soft {
  color: var(--danger);
  border-color: color-mix(in srgb, var(--danger) 35%, var(--border));
  background: color-mix(in srgb, var(--danger) 5%, var(--panel));
}
.watch-side-redesign {
  display: grid;
  gap: var(--sp-3);
  position: sticky;
  top: calc(var(--topbar-h) + var(--sp-4));
  max-height: calc(100vh - var(--topbar-h) - var(--sp-5));
  overflow-y: auto;
  padding-right: 2px;
}
.watch-side-card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: var(--sp-4);
  box-shadow: var(--shadow-sm);
}
.watch-side-head {
  display: flex;
  justify-content: space-between;
  gap: var(--sp-3);
  align-items: center;
  margin-bottom: var(--sp-2);
}
.watch-side-head h3 {
  color: var(--text-strong);
  font-size: var(--fs-lg);
  letter-spacing: -0.02em;
}
.count-pill,
.round-plus {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  border-radius: 999px;
  padding: 0 8px;
  background: var(--panel-soft);
  color: var(--text-secondary);
  border: 1px solid var(--border);
  font-size: var(--fs-xs);
  font-weight: 800;
}
.round-plus {
  color: var(--accent-dark);
  background: var(--accent-soft);
}
.watch-side-card .meta {
  font-family: var(--font-sans);
  color: var(--text-secondary);
  line-height: 1.45;
  margin-bottom: var(--sp-3);
}
.watch-source-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--sp-2);
  background: var(--panel-elevated);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: var(--sp-3);
  margin: 0 0 var(--sp-2);
}
.watch-source-row.inactive { opacity: .55; }
.watch-source-main strong,
.watch-source-main span,
.watch-source-main small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.watch-source-main strong { color: var(--text-strong); font-size: var(--fs-md); }
.watch-source-main span { color: var(--text-secondary); font-size: var(--fs-sm); margin-top: 3px; }
.watch-source-main small { color: var(--text-muted); font-size: var(--fs-xs); margin-top: 2px; }
.watch-source-actions {
  display: flex;
  gap: var(--sp-2);
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}
.watch-source-type-pill {
  margin-right: auto;
  padding: 4px 8px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-dark);
  font-size: var(--fs-xs);
  font-weight: 800;
}
html[data-theme="dark"] .watch-source-type-pill { color: var(--accent); }
.watch-add-source-card label,
.watch-side-redesign label {
  display: grid;
  gap: 6px;
  color: var(--text-secondary);
  font-size: var(--fs-sm);
  font-weight: 700;
  margin-bottom: var(--sp-2);
  text-transform: none;
  letter-spacing: 0;
  font-family: var(--font-sans);
}
.watch-add-source-card .primary {
  width: 100%;
  min-height: 40px;
  border-radius: 10px;
}
.watch-keywords-redesign {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: var(--sp-3) 0;
}
.watch-keyword-add {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--sp-2);
}
.watch-empty-state,
.watch-empty-card {
  display: grid;
  gap: 4px;
  padding: var(--sp-5);
  border: 1px dashed var(--border-strong);
  border-radius: 16px;
  background: var(--panel);
  color: var(--text-secondary);
  text-align: center;
}
.watch-empty-state strong { color: var(--text-strong); }
.watch-empty-state span { color: var(--text-secondary); }

@media (max-width: 1280px) {
  .watch-hero-card { grid-template-columns: 1fr; }
  .watch-hero-controls { grid-template-columns: minmax(0, 1fr) 180px auto; }
  .watch-main-grid { grid-template-columns: 1fr; }
  .watch-side-redesign { position: static; max-height: none; grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
  .watch-hero-controls { grid-template-columns: 1fr; }
  .watch-hero-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .watch-result-card { grid-template-columns: 1fr; }
  .watch-result-actions { min-width: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .watch-side-redesign { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .watch-hero-kpis { grid-template-columns: 1fr; }
  .watch-result-actions { grid-template-columns: 1fr 1fr; }
  .watch-feed-bar { align-items: flex-start; flex-direction: column; }
}

/* ============================================================================
   V1.34.15 — Fiche mairie : historique d’échange structuré type fiche contrat
   ============================================================================ */
.townhall-card {
  gap: var(--sp-5);
}

.townhall-card-header {
  align-items: center;
}

.townhall-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--sp-3);
}

.townhall-summary-card {
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: var(--sp-3) var(--sp-4);
  min-height: 68px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
}

.townhall-summary-card span:first-child {
  color: var(--text-muted);
  font-size: var(--fs-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.townhall-summary-card strong {
  color: var(--text-strong);
  font-size: var(--fs-sm);
  font-weight: 800;
}

.townhall-section-card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  box-shadow: var(--shadow-xs);
  display: grid;
  gap: var(--sp-3);
}

.townhall-section-head {
  align-items: flex-start;
  border-bottom: 1px solid var(--border);
  padding-bottom: var(--sp-3);
}

.townhall-section-head h4 {
  color: var(--text-strong);
  font-size: var(--fs-md);
  font-family: var(--font-sans);
  font-weight: 800;
  margin: 0;
  text-transform: none;
  letter-spacing: 0;
}

.townhall-exchange-list {
  gap: 10px;
}

.townhall-exchange-row {
  border: 1px solid var(--border);
  background: var(--panel-soft);
  border-radius: var(--r-md);
  padding: var(--sp-2);
}

.townhall-exchange-row .exchange-date-box {
  min-width: 160px;
}

.townhall-exchange-headline {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  margin-bottom: 6px;
}

.townhall-exchange-type {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 4px 9px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-dark);
  border: 1px solid color-mix(in srgb, var(--accent) 28%, transparent);
  font-size: var(--fs-xs);
  font-weight: 800;
}

html[data-theme="dark"] .townhall-exchange-type {
  color: var(--accent);
}

.townhall-exchange-add-box {
  display: grid;
  gap: var(--sp-3);
  padding-top: var(--sp-3);
  border-top: 1px dashed var(--border);
}

.townhall-exchange-form-grid,
.townhall-exchange-edit-grid {
  display: grid;
  grid-template-columns: minmax(130px, 0.75fr) minmax(132px, 0.75fr) minmax(210px, 1.2fr);
  gap: var(--sp-2);
  align-items: end;
}

.townhall-exchange-form-grid label,
.townhall-exchange-edit-grid label {
  color: var(--text-secondary);
  font-size: var(--fs-sm);
  font-weight: 700;
  display: grid;
  gap: 6px;
}

.townhall-exchange-add-box textarea,
.townhall-exchange-row textarea {
  min-height: 82px;
  width: 100%;
  resize: vertical;
}

.townhall-add-reminder-box {
  border-top: 1px dashed var(--border);
  padding-top: var(--sp-3);
}

.townhall-reminder-card {
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-3);
  display: grid;
  gap: var(--sp-2);
}

html[data-theme="dark"] .townhall-section-card,
html[data-theme="dark"] .townhall-summary-card,
html[data-theme="dark"] .townhall-exchange-row,
html[data-theme="dark"] .townhall-reminder-card {
  background: var(--panel-soft);
  border-color: var(--border);
}

@media (max-width: 1100px) {
  .townhall-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .townhall-exchange-form-grid,
  .townhall-exchange-edit-grid { grid-template-columns: 1fr 1fr; }
  .townhall-exchange-form-grid label:nth-child(3) { grid-column: 1 / -1; }
}

@media (max-width: 680px) {
  .townhall-summary-grid,
  .townhall-exchange-form-grid,
  .townhall-exchange-edit-grid { grid-template-columns: 1fr; }
  .townhall-exchange-row .exchange-date-box { min-width: 0; }
}

/* ============================================================================
   V1.34.16 — Correctif fiche mairie : bouton historique non étiré
   ============================================================================ */
.townhall-exchange-add-box {
  align-items: start;
  justify-items: stretch;
  grid-auto-rows: max-content;
  align-content: start;
}

.townhall-exchange-add-box > button.primary,
.townhall-add-reminder-box .reminder-actions > button.primary {
  justify-self: start;
  align-self: start;
  width: auto;
  min-width: 0;
  max-width: 100%;
  height: auto;
  min-height: 40px;
  padding: 10px 16px;
  border-radius: var(--r-md);
}

.townhall-exchange-add-box textarea {
  display: block;
  min-height: 82px;
  max-height: 220px;
}

.townhall-section-card {
  align-content: start;
  grid-auto-rows: max-content;
}

/* ============================================================================
   V1.34.17 — Rappels globaux : urgence + mairies + suppression en un clic
   ============================================================================ */
.reminders-page-layout-v13417 {
  display: grid;
  gap: 16px;
  max-width: 1280px;
}

.reminder-add-panel-v13417,
.reminders-current-panel-v13417 {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 16px;
  box-shadow: var(--shadow-soft, var(--shadow));
}

.reminder-panel-heading-v13417 {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 12px;
}

.reminder-panel-heading-v13417 h3 {
  margin: 0 0 4px;
  font-size: 18px;
  line-height: 1.2;
}

.reminder-add-form-v13417 {
  display: grid;
  grid-template-columns: minmax(220px, 1.25fr) minmax(140px, .75fr) minmax(150px, .75fr) minmax(180px, .9fr) minmax(260px, 1.25fr) auto;
  gap: 10px;
  align-items: end;
}

.reminder-add-form-v13417 label {
  display: grid;
  gap: 5px;
  min-width: 0;
  font-size: 12px;
  font-weight: 700;
  color: var(--text-muted);
}

.reminder-add-form-v13417 label > span {
  color: var(--text-secondary, var(--text-muted));
}

.reminder-add-form-v13417 input,
.reminder-add-form-v13417 select,
.reminder-add-form-v13417 .time-select-pair select {
  min-height: 38px;
  width: 100%;
  min-width: 0;
  background: var(--panel);
  color: var(--text);
}

.reminder-add-submit-v13417 {
  height: 38px !important;
  min-height: 38px !important;
  width: auto !important;
  white-space: nowrap;
  align-self: end;
  justify-self: start;
  padding: 0 14px !important;
}

.reminder-summary-pills-v13417 {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.summary-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--panel-soft);
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 800;
}
.summary-pill.field {
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  border-color: color-mix(in srgb, var(--accent) 32%, var(--border));
  color: var(--accent-dark, var(--accent));
}
.summary-pill.townhall {
  background: color-mix(in srgb, #8b5cf6 12%, transparent);
  border-color: color-mix(in srgb, #8b5cf6 32%, var(--border));
  color: #7c3aed;
}
.summary-pill.urgent {
  background: color-mix(in srgb, var(--danger) 12%, transparent);
  border-color: color-mix(in srgb, var(--danger) 38%, var(--border));
  color: var(--danger);
}

.reminder-current-list-v13417 {
  display: grid;
  gap: 10px;
}

.reminder-unified-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-height: 0;
  padding: 12px 12px 12px 14px;
  background: var(--panel-soft);
  border: 1px solid var(--border);
  border-left: 4px solid color-mix(in srgb, var(--accent) 65%, var(--border));
  border-radius: 14px;
}

.reminder-unified-card.is-overdue {
  border-left-color: var(--danger);
  background: color-mix(in srgb, var(--danger) 7%, var(--panel));
}

.reminder-unified-main {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.reminder-unified-topline,
.reminder-unified-title {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.reminder-unified-title strong {
  color: var(--text-strong, var(--text));
  font-size: 14px;
}

.reminder-unified-title span {
  color: var(--text-muted);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 72ch;
}

.reminder-unified-note {
  color: var(--text-muted);
  font-size: 13px;
  line-height: 1.35;
  min-width: 0;
  overflow-wrap: anywhere;
}

.reminder-unified-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
}

.reminder-source-badge,
.reminder-urgent-pill,
.reminder-date-pill {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.2;
}

.reminder-source-badge.is-field {
  background: color-mix(in srgb, var(--accent) 13%, transparent);
  color: var(--accent-dark, var(--accent));
  border: 1px solid color-mix(in srgb, var(--accent) 32%, transparent);
}

.reminder-source-badge.is-townhall {
  background: color-mix(in srgb, #8b5cf6 13%, transparent);
  color: #7c3aed;
  border: 1px solid color-mix(in srgb, #8b5cf6 32%, transparent);
}

.reminder-date-pill {
  background: var(--panel);
  color: var(--text-strong, var(--text));
  border: 1px solid var(--border);
}

.reminder-date-pill.urgent,
.reminder-urgent-pill {
  background: color-mix(in srgb, var(--danger) 12%, transparent);
  color: var(--danger);
  border: 1px solid color-mix(in srgb, var(--danger) 36%, transparent);
}

.one-click-delete {
  border-color: color-mix(in srgb, var(--danger) 45%, var(--border)) !important;
}

.reminder-edit-inline-v13417 {
  grid-template-columns: minmax(135px, .7fr) minmax(135px, .7fr) minmax(180px, .9fr) minmax(260px, 1.3fr);
  width: 100%;
}

.reminder-unified-card.is-editing {
  grid-template-columns: auto minmax(0, 1fr);
}

html[data-theme="dark"] .summary-pill.townhall,
html[data-theme="dark"] .reminder-source-badge.is-townhall {
  color: #c4b5fd;
}
html[data-theme="dark"] .summary-pill.field,
html[data-theme="dark"] .reminder-source-badge.is-field {
  color: var(--accent);
}

@media (max-width: 1180px) {
  .reminder-add-form-v13417 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .reminder-add-submit-v13417 { justify-self: start; }
}

@media (max-width: 720px) {
  .reminder-panel-heading-v13417,
  .reminder-unified-card {
    grid-template-columns: 1fr;
  }
  .reminder-panel-heading-v13417 { display: grid; }
  .reminder-summary-pills-v13417 { justify-content: flex-start; }
  .reminder-add-form-v13417,
  .reminder-edit-inline-v13417 {
    grid-template-columns: 1fr;
  }
  .reminder-unified-actions { justify-content: flex-start; }
}

/* V1.34.17 — Fiches mairie : formulaires compacts et boutons non étirés */
.townhall-exchange-add-box,
.townhall-add-reminder-box {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  align-items: start !important;
  justify-items: stretch !important;
  align-content: start !important;
  grid-auto-rows: max-content !important;
}

.townhall-exchange-form-grid,
.townhall-exchange-edit-grid,
.townhall-reminder-grid {
  display: grid !important;
  grid-template-columns: minmax(140px, 170px) minmax(132px, 150px) minmax(220px, 1fr) minmax(260px, 1.1fr) !important;
  gap: 8px !important;
  align-items: end !important;
  max-width: 920px !important;
}

.townhall-exchange-form-grid {
  grid-template-columns: minmax(140px, 170px) minmax(132px, 150px) minmax(220px, 1fr) !important;
}

.townhall-exchange-form-grid label,
.townhall-exchange-edit-grid label {
  display: grid !important;
  gap: 5px !important;
}

.townhall-exchange-add-box textarea,
.townhall-exchange-row textarea {
  min-height: 74px !important;
  max-height: 180px !important;
}

.townhall-exchange-add-box > button.primary,
.townhall-add-reminder-box .reminder-actions > button.primary,
.townhall-add-reminder-box button.primary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  justify-self: start !important;
  align-self: start !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 14px !important;
  white-space: nowrap !important;
  line-height: 1.1 !important;
  text-align: center !important;
  border-radius: 9px !important;
}

.townhall-add-reminder-box .reminder-actions {
  display: flex !important;
  justify-content: flex-start !important;
  margin-top: 0 !important;
}

@media (max-width: 980px) {
  .townhall-exchange-form-grid,
  .townhall-exchange-edit-grid,
  .townhall-reminder-grid {
    grid-template-columns: 1fr 1fr !important;
    max-width: none !important;
  }
}

@media (max-width: 620px) {
  .townhall-exchange-form-grid,
  .townhall-exchange-edit-grid,
  .townhall-reminder-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ========================================================================== 
   V1.34.18 — Tableau de bord : lisibilité / hiérarchie visuelle
   --------------------------------------------------------------------------
   Refonte de forme sans changement fonctionnel : cartes plus lisibles,
   carte centrale plus forte, KPI clarifiés, dark/light conservé.
   ========================================================================== */

.dashboard-v13418-cover {
  --dash-radius: 14px;
  --dash-radius-sm: 10px;
  --dash-gap: 16px;
  gap: var(--dash-gap);
}

.dashboard-v13418-cover .dashboard-hero-v13418,
.dashboard-v13418-cover .dashboard-card-v13418,
.dashboard-v13418-cover .financial-widget,
.dashboard-v13418-cover .mayor-card,
.dashboard-v13418-cover .news-card-preview,
.dashboard-v13418-cover .weather-card {
  border-radius: var(--dash-radius);
  border: 1px solid color-mix(in srgb, var(--border) 78%, var(--accent) 8%);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--panel) 98%, white 2%), var(--panel));
  box-shadow: 0 10px 30px rgba(15, 23, 42, .045);
  padding: 22px;
}

html[data-theme="dark"] .dashboard-v13418-cover .dashboard-hero-v13418,
html[data-theme="dark"] .dashboard-v13418-cover .dashboard-card-v13418,
html[data-theme="dark"] .dashboard-v13418-cover .financial-widget,
html[data-theme="dark"] .dashboard-v13418-cover .mayor-card,
html[data-theme="dark"] .dashboard-v13418-cover .news-card-preview,
html[data-theme="dark"] .dashboard-v13418-cover .weather-card {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--panel) 86%, var(--panel-elevated) 14%), var(--panel));
  border-color: color-mix(in srgb, var(--border-strong) 72%, var(--accent) 6%);
  box-shadow: 0 12px 36px rgba(0, 0, 0, .28);
}

/* Liseré animé activé sur toutes les cartes du dashboard */

.dashboard-v13418-cover .dashboard-hero-v13418 {
  border-left: 0;
  display: flex;
  align-items: center;
  min-height: 86px;
}

.dashboard-hero-main-v13418 {
  display: flex;
  align-items: center;
  gap: 18px;
  min-width: 0;
}

.dashboard-hero-logo-v13418 {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  color: var(--accent-on);
  background: linear-gradient(135deg, var(--accent), var(--accent-dark));
  font-size: 25px;
  font-weight: 900;
  box-shadow: 0 10px 22px color-mix(in srgb, var(--accent) 22%, transparent);
}

.dashboard-hero-v13418 h2 {
  font-family: var(--font-sans);
  font-size: clamp(22px, 1.65vw, 30px);
  line-height: 1.1;
  letter-spacing: -0.03em;
  color: var(--text-strong);
}

.dashboard-hero-v13418 .meta {
  margin-top: 6px;
  font-family: var(--font-sans);
  font-size: 13px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--text-secondary);
}

.dashboard-hero-actions-v13418 {
  align-items: center;
  margin-left: auto;
}

.dashboard-hero-actions-v13418 .hero-btn {
  height: 42px;
  padding: 0 16px;
  border-radius: 10px;
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
  background: var(--panel-soft);
  color: var(--text-strong);
  box-shadow: none;
}

.dashboard-hero-actions-v13418 .hero-btn-primary-v13418 {
  background: color-mix(in srgb, var(--accent) 12%, var(--panel));
  border-color: color-mix(in srgb, var(--accent) 34%, var(--border));
  color: var(--accent-dark);
}

.dashboard-v13418-layout {
  gap: 16px;
}

.dashboard-row-top-v13418 {
  grid-template-columns: minmax(0, 1.55fr) minmax(360px, .95fr);
}

.dashboard-row-main-v13418 {
  grid-template-columns: minmax(0, 1.75fr) minmax(330px, .9fr);
}

.dashboard-row-bottom-v13418 {
  grid-template-columns: minmax(280px, .95fr) minmax(300px, .95fr) minmax(360px, 1.05fr);
}

.dashboard-v13418-cover .board-card-head,
.dashboard-v13418-cover .dashboard-card-head-v13418,
.dashboard-v13418-cover .nav-widget-head,
.dashboard-v13418-cover .financial-widget-head {
  margin: 0 0 14px;
  align-items: center;
}

.dashboard-v13418-cover .board-card-title,
.dashboard-v13418-cover .card-title,
.dashboard-v13418-cover .widget-title-wrap {
  gap: 12px;
}

/* === Hover spécifique aux cartes dans le dashboard (spécificité suffisante pour écraser le gradient) === */
.dashboard-v13418-cover .dashboard-card-v13418:hover,
.dashboard-v13418-cover .financial-widget:hover,
.dashboard-v13418-cover .mayor-card:hover,
.dashboard-v13418-cover .news-card-preview:hover,
.dashboard-v13418-cover .weather-card:hover,
.dashboard-v13418-cover .board-card:hover,
.dashboard-v13418-cover .dashboard-reminders-card:hover,
.dashboard-v13418-cover .dashboard-map-card:hover {
  background: var(--accent-soft) !important;
  border-color: var(--card-accent, var(--accent));
  transform: translateY(-5px);
  box-shadow: 0 16px 36px rgba(0, 0, 0, .13), 0 0 0 2px var(--card-accent, var(--accent));
  transition: transform var(--t-slow), box-shadow var(--t-slow), border-color var(--t-slow), background var(--t-slow);
}
html[data-theme="dark"] .dashboard-v13418-cover .dashboard-card-v13418:hover,
html[data-theme="dark"] .dashboard-v13418-cover .financial-widget:hover,
html[data-theme="dark"] .dashboard-v13418-cover .mayor-card:hover,
html[data-theme="dark"] .dashboard-v13418-cover .news-card-preview:hover,
html[data-theme="dark"] .dashboard-v13418-cover .weather-card:hover,
html[data-theme="dark"] .dashboard-v13418-cover .board-card:hover,
html[data-theme="dark"] .dashboard-v13418-cover .dashboard-reminders-card:hover,
html[data-theme="dark"] .dashboard-v13418-cover .dashboard-map-card:hover {
  box-shadow: 0 16px 36px rgba(0, 0, 0, .5), 0 0 0 2px var(--card-accent, var(--accent));
}

/* Assurer la transition sur le background pour toutes ces cartes */
.dashboard-v13418-cover .dashboard-card-v13418,
.dashboard-v13418-cover .financial-widget,
.dashboard-v13418-cover .mayor-card,
.dashboard-v13418-cover .news-card-preview,
.dashboard-v13418-cover .weather-card,
.dashboard-v13418-cover .board-card,
.dashboard-v13418-cover .dashboard-reminders-card,
.dashboard-v13418-cover .dashboard-map-card {
  transition: transform var(--t-slow), box-shadow var(--t-slow), border-color var(--t-slow), background var(--t-slow);
}

.dashboard-v13418-cover .board-icon {
  width: 42px;
  height: 42px;
  min-width: 42px;
  border-radius: 12px;
  font-size: 20px;
  background: color-mix(in srgb, var(--card-accent, var(--accent)) 13%, var(--panel));
  border-color: color-mix(in srgb, var(--card-accent, var(--accent)) 24%, var(--border));
}

.dashboard-v13418-cover .board-card h3,
.dashboard-v13418-cover .board-card-title h3,
.dashboard-v13418-cover .financial-widget h3,
.dashboard-v13418-cover .dashboard-reminders-card h3,
.dashboard-v13418-cover .mayor-card h3,
.dashboard-v13418-cover .news-card-preview h3,
.dashboard-v13418-cover .weather-card h3,
.dashboard-v13418-cover .nav-widget-title {
  font-family: var(--font-sans);
  font-size: 18px;
  font-weight: 850;
  color: var(--text-strong);
  letter-spacing: -0.015em;
  text-transform: none;
}

.dashboard-v13418-cover .board-card h3::before,
.dashboard-v13418-cover .financial-widget h3::before,
.dashboard-v13418-cover .dashboard-map-card h3::before,
.dashboard-v13418-cover .dashboard-reminders-card h3::before,
.dashboard-v13418-cover .mayor-card h3::before,
.dashboard-v13418-cover .news-card-preview h3::before,
.dashboard-v13418-cover .weather-card h3::before,
.dashboard-v13418-cover .nav-widget-title::before {
  content: none;
}

.dashboard-v13418-cover .meta,
.dashboard-v13418-cover .board-card .meta,
.dashboard-v13418-cover .dashboard-map-card .nav-widget-desc,
.dashboard-v13418-cover .financial-widget .meta,
.dashboard-v13418-cover .dashboard-reminders-card .meta,
.dashboard-v13418-cover .mayor-card .meta,
.dashboard-v13418-cover .news-card-preview .meta,
.dashboard-v13418-cover .weather-card .meta {
  font-family: var(--font-sans);
  font-size: 13px;
  color: var(--text-secondary);
  letter-spacing: 0;
  text-transform: none;
}

/* Contrats & foncier */
.dashboard-contracts-v13418 {
  min-height: 275px;
}

.dashboard-foncier-main-v13418 {
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 22px;
}

.dashboard-ring-v13418 {
  --ring-color: var(--accent);
  width: 138px;
  height: 138px;
  border-radius: 50%;
  background: conic-gradient(var(--ring-color) calc(var(--pct) * 1%), color-mix(in srgb, var(--border) 70%, transparent) 0);
  display: grid;
  place-items: center;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 10%, transparent);
}

.dashboard-ring-v13418::before {
  content: "";
  position: absolute;
  width: 104px;
  height: 104px;
  border-radius: 50%;
  background: var(--panel);
  box-shadow: inset 0 0 0 1px var(--border-soft);
}

.dashboard-ring-v13418 .ring-inner {
  position: relative;
  z-index: 1;
  text-align: center;
}

.dashboard-ring-v13418 .ring-value {
  font-family: var(--font-sans);
  font-size: 32px;
  color: var(--accent-dark);
  font-weight: 900;
}

.dashboard-ring-v13418 .ring-label {
  font-family: var(--font-sans);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--text-muted);
  font-weight: 800;
}

.dashboard-foncier-kpis-v13418 {
  gap: 12px;
}

.dashboard-foncier-kpis-v13418 .foncier-kpi-line {
  border-radius: 12px;
  padding: 14px;
  min-height: 72px;
  background: var(--panel-soft);
}

.dashboard-foncier-kpis-v13418 .foncier-kpi-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  font-size: 17px;
}

.dashboard-foncier-kpis-v13418 .foncier-kpi-line strong {
  font-size: 15px;
  line-height: 1.25;
}

.dashboard-foncier-kpis-v13418 .foncier-kpi-line span:not(.foncier-kpi-icon) {
  font-size: 12px;
}

.dashboard-status-strip-v13418 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--border-soft);
}

.dashboard-status-chip-v13418 {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 32px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--chip-color) 30%, var(--border));
  background: color-mix(in srgb, var(--chip-color) 10%, var(--panel));
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 750;
}

.dashboard-status-chip-v13418 .chip-dot {
  width: 9px;
  height: 9px;
  border-radius: 3px;
  background: var(--chip-color);
}

.dashboard-status-chip-v13418 strong {
  color: var(--chip-color);
  font-weight: 900;
}

/* Chiffres & productible */
.dashboard-row-top-v13418 .financial-widget {
  min-height: 275px;
}

.dashboard-row-top-v13418 .financial-kpi-grid {
  gap: 12px;
}

.dashboard-row-top-v13418 .financial-kpi-grid > div {
  border-radius: 12px;
  min-height: 74px;
  padding: 16px;
  border-color: var(--border);
}

.dashboard-row-top-v13418 .financial-kpi-grid > div:nth-child(1) {
  background: color-mix(in srgb, var(--accent) 10%, var(--panel));
  border-color: color-mix(in srgb, var(--accent) 22%, var(--border));
}
.dashboard-row-top-v13418 .financial-kpi-grid > div:nth-child(2) {
  background: color-mix(in srgb, #3b82f6 8%, var(--panel));
  border-color: color-mix(in srgb, #3b82f6 18%, var(--border));
}
.dashboard-row-top-v13418 .financial-kpi-grid > div:nth-child(3) {
  background: color-mix(in srgb, var(--warning) 10%, var(--panel));
  border-color: color-mix(in srgb, var(--warning) 22%, var(--border));
}
.dashboard-row-top-v13418 .financial-kpi-grid > div:nth-child(4) {
  background: color-mix(in srgb, #8b5cf6 8%, var(--panel));
  border-color: color-mix(in srgb, #8b5cf6 18%, var(--border));
}

.dashboard-row-top-v13418 .financial-kpi-grid strong {
  font-family: var(--font-sans);
  font-size: 21px;
  font-weight: 900;
}

.dashboard-row-top-v13418 .financial-kpi-grid > div:first-child strong {
  color: var(--accent-dark);
  font-size: 24px;
}

.dashboard-row-top-v13418 .financial-kpi-grid span {
  font-family: var(--font-sans);
  font-size: 12px;
  text-transform: none;
  letter-spacing: 0;
}

.dashboard-row-top-v13418 .financial-note {
  font-size: 13px;
  color: var(--text-secondary);
  margin-top: 12px;
}

.dashboard-row-top-v13418 .financial-detail-link {
  color: var(--accent-dark);
  font-weight: 850;
}

/* Carte centrale */
.dashboard-map-v13418 {
  min-height: 420px;
  cursor: pointer;
}

.dashboard-map-head-v13418 {
  align-items: flex-start;
}

.dashboard-map-open-v13418,
.dashboard-card-link-v13418 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 34px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--panel-soft);
  color: var(--text-strong);
  font-size: 12px;
  font-weight: 850;
  white-space: nowrap;
}

.dashboard-map-v13418 .dashboard-map-preview {
  min-height: 330px;
  border-radius: 12px;
  border-color: var(--border);
}

.dashboard-map-legend-v13418 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  padding-top: 12px;
  margin-top: 0;
}

.dashboard-map-legend-item-v13418 {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--text-secondary);
  font-weight: 750;
}

.dashboard-map-legend-item-v13418 i {
  width: 10px;
  height: 10px;
  border-radius: 3px;
  display: inline-block;
  background: var(--legend-color);
}

/* Rappels */
.dashboard-reminders-v13418 {
  min-height: 420px;
}

.dashboard-reminder-summary-v13418 {
  margin-top: 0;
  gap: 16px;
}

.dashboard-reminder-total-v13418 {
  gap: 9px;
  border-bottom-color: var(--border-soft);
}

.dashboard-reminder-total-v13418 strong {
  color: var(--text-strong);
  font-family: var(--font-sans);
  font-size: 34px;
  font-weight: 900;
}

.dashboard-urgent-badge-v13418 {
  margin-left: auto;
  height: 26px;
  padding: 0 9px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--danger) 13%, var(--panel));
  color: var(--danger);
  border: 1px solid color-mix(in srgb, var(--danger) 25%, var(--border));
  font-size: 12px;
  font-weight: 850;
}

.dashboard-next-reminder-v13418 {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: flex-start;
  gap: 14px;
  min-height: 160px;
  border-left: 0;
  border-radius: 13px;
  background: var(--panel-soft);
}

.dashboard-next-reminder-v13418.is-overdue {
  background: color-mix(in srgb, var(--danger) 8%, var(--panel));
  border-color: color-mix(in srgb, var(--danger) 28%, var(--border));
}

.dashboard-next-icon-v13418 {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in srgb, var(--accent) 14%, var(--panel));
  border: 1px solid color-mix(in srgb, var(--accent) 25%, var(--border));
}

.dashboard-next-reminder-v13418 > div strong {
  font-family: var(--font-sans);
  font-size: 15px;
  color: var(--text-strong);
}

.dashboard-next-reminder-v13418 .meta {
  display: block;
  margin-top: 6px;
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 700;
}

.dashboard-next-reminder-v13418 p {
  margin: 16px 0 0;
  color: var(--text-secondary);
  font-size: 13px;
}

.dashboard-widget-hint-v13418 {
  border-top: 0;
  color: var(--accent-dark);
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: none;
}

/* Cartes basses */
.dashboard-row-bottom-v13418 .mayor-card,
.dashboard-row-bottom-v13418 .news-card-preview,
.dashboard-row-bottom-v13418 .weather-card {
  min-height: 290px;
}

.dashboard-row-bottom-v13418 .mayor-info-grid {
  gap: 10px;
}

.dashboard-row-bottom-v13418 .mayor-info {
  display: flex;
  align-items: center;
  gap: 10px;
  border-radius: 11px;
  padding: 12px;
  background: var(--panel-soft);
}

/* ::before supprimé — le th-icon-box emoji prend sa place */
.dashboard-row-bottom-v13418 .mayor-info .th-icon-box {
  flex-shrink: 0;
}

.dashboard-row-bottom-v13418 .mayor-info .th-info-text {
  flex: 1;
  min-width: 0;
}

.dashboard-row-bottom-v13418 .mayor-info strong {
  margin: 0;
  color: var(--text-strong);
}

.dashboard-row-bottom-v13418 .watch-preview-kpis div,
.dashboard-row-bottom-v13418 .watch-preview-item,
.dashboard-row-bottom-v13418 .weather-day,
.dashboard-row-bottom-v13418 .weather-today-card,
.dashboard-row-bottom-v13418 .weather-hour {
  border-radius: 11px;
}

@media (max-width: 1320px) {
  .dashboard-row-top-v13418,
  .dashboard-row-main-v13418,
  .dashboard-row-bottom-v13418 {
    grid-template-columns: 1fr;
  }

  .dashboard-map-v13418 .dashboard-map-preview {
    min-height: 300px;
  }
}

@media (max-width: 760px) {
  .dashboard-hero-main-v13418 {
    align-items: flex-start;
  }
  .dashboard-hero-logo-v13418 {
    width: 42px;
    height: 42px;
  }
  .dashboard-foncier-main-v13418 {
    grid-template-columns: 1fr;
  }
  .dashboard-foncier-kpis-v13418 {
    grid-template-columns: 1fr;
  }
  .dashboard-row-top-v13418 .financial-kpi-grid,
  .financial-kpi-grid {
    grid-template-columns: 1fr;
  }
  .dashboard-v13418-cover .dashboard-hero-v13418,
  .dashboard-v13418-cover .dashboard-card-v13418,
  .dashboard-v13418-cover .financial-widget,
  .dashboard-v13418-cover .mayor-card,
  .dashboard-v13418-cover .news-card-preview,
  .dashboard-v13418-cover .weather-card {
    padding: 16px;
  }
}

/* =============================================================
   AUTH — LOGIN SCREEN
   ============================================================= */

.login-screen {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg, #0f1117);
  overflow: hidden;
}

.login-screen.hidden { display: none; }

/* Blobs décoratifs */
.login-bg-blobs { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.login-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.18;
  animation: blobFloat 8s ease-in-out infinite;
}
.login-blob-1 {
  width: 420px; height: 420px;
  background: var(--accent, #3ecfb2);
  top: -120px; left: -80px;
  animation-delay: 0s;
}
.login-blob-2 {
  width: 340px; height: 340px;
  background: #818cf8;
  bottom: -100px; right: -60px;
  animation-delay: -3s;
}
.login-blob-3 {
  width: 280px; height: 280px;
  background: #f59e0b;
  top: 50%; left: 55%;
  animation-delay: -5s;
}
@keyframes blobFloat {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33%       { transform: translate(20px, -30px) scale(1.05); }
  66%       { transform: translate(-15px, 20px) scale(0.97); }
}

/* Carte login */
.login-card {
  position: relative;
  z-index: 1;
  width: 420px;
  max-width: calc(100vw - 40px);
  background: var(--panel, #1a1f2e);
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-radius: 20px;
  padding: 40px 36px 32px;
  box-shadow: 0 32px 80px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.04);
  animation: loginCardIn 0.5s cubic-bezier(.4,0,.2,1) both;
}
@keyframes loginCardIn {
  from { opacity: 0; transform: translateY(28px) scale(.97); }
  to   { opacity: 1; transform: none; }
}

.login-logo {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 32px;
}
.login-logo-icon-wrap {
  width: 52px; height: 52px;
  background: linear-gradient(135deg, var(--accent, #3ecfb2) 0%, #10b981 100%);
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.6rem;
  flex-shrink: 0;
  box-shadow: 0 6px 20px rgba(62,207,178,.3);
}
.login-title {
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--text-strong, #fff);
  margin: 0;
  line-height: 1.2;
}
.login-subtitle {
  font-size: var(--fs-xs, .72rem);
  color: var(--text-secondary, #8892a0);
  margin: 2px 0 0;
}

.login-form { display: flex; flex-direction: column; gap: 18px; }

.login-field { display: flex; flex-direction: column; gap: 6px; }
.login-field label {
  font-size: var(--fs-sm, .8rem);
  font-weight: 600;
  color: var(--text-secondary, #8892a0);
  letter-spacing: .02em;
}
.login-input-wrap {
  position: relative;
  display: flex;
  align-items: center;
}
.login-input-icon {
  position: absolute;
  left: 12px;
  font-size: .9rem;
  pointer-events: none;
  z-index: 1;
}
.login-input-wrap input {
  width: 100%;
  padding: 11px 40px 11px 38px;
  background: var(--bg-alt, rgba(255,255,255,.04));
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-radius: var(--r-md, 8px);
  color: var(--text, #e2e8f0);
  font-size: .9rem;
  transition: border-color .2s, box-shadow .2s;
  box-sizing: border-box;
}
.login-input-wrap input:focus {
  outline: none;
  border-color: var(--accent, #3ecfb2);
  box-shadow: 0 0 0 3px rgba(62,207,178,.15);
}
.login-toggle-pwd {
  position: absolute; right: 10px;
  background: none; border: none;
  color: var(--text-secondary, #8892a0);
  cursor: pointer; padding: 4px;
  display: flex; align-items: center;
  opacity: .7; transition: opacity .2s;
}
.login-toggle-pwd:hover { opacity: 1; }

.login-error {
  background: rgba(239,68,68,.12);
  border: 1px solid rgba(239,68,68,.3);
  border-radius: var(--r-md, 8px);
  color: #f87171;
  font-size: var(--fs-sm, .8rem);
  padding: 10px 14px;
}

.login-btn {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  background: linear-gradient(135deg, var(--accent, #3ecfb2) 0%, #10b981 100%);
  color: #0f1117;
  border: none;
  border-radius: var(--r-md, 8px);
  padding: 13px 20px;
  font-size: .95rem;
  font-weight: 700;
  cursor: pointer;
  transition: opacity .2s, transform .15s;
  margin-top: 4px;
  box-shadow: 0 6px 20px rgba(62,207,178,.25);
}
.login-btn:hover { opacity: .9; transform: translateY(-1px); }
.login-btn:active { transform: translateY(0); }
.login-btn:disabled { opacity: .5; cursor: default; }

.first-password-panel {
  margin-top: 4px;
}

.first-password-logout {
  width: 100%;
  justify-content: center;
}

.login-demo-hint {
  margin-top: 24px;
  padding: 14px;
  background: rgba(62,207,178,.06);
  border: 1px solid rgba(62,207,178,.15);
  border-radius: var(--r-md, 8px);
  font-size: var(--fs-xs, .72rem);
}
.login-demo-hint-btn {
  width: 100%;
  text-align: left;
  cursor: pointer;
  transition: background .2s, border-color .2s, transform .15s;
  color: inherit;
}
.login-demo-hint-btn:hover {
  background: rgba(62,207,178,.13);
  border-color: rgba(62,207,178,.35);
  transform: translateY(-1px);
}
.login-demo-hint-btn:active { transform: none; }
.login-demo-label {
  color: var(--accent, #3ecfb2);
  font-weight: 600;
  margin-bottom: 6px;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.login-demo-creds {
  display: flex; flex-direction: column; gap: 3px;
  color: var(--text-secondary, #8892a0);
}
.login-demo-creds strong { color: var(--text, #e2e8f0); }

.login-version {
  text-align: center;
  margin-top: 20px;
  font-size: .68rem;
  color: var(--text-muted, rgba(255,255,255,.2));
}

/* =============================================================
   AUTH — USER BADGE & DROPDOWN
   ============================================================= */

.user-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-weight: 700;
  color: #0f1117;
  flex-shrink: 0;
  font-size: .75rem;
  width: 32px; height: 32px; min-width: 32px;
  letter-spacing: -.5px;
}
.user-avatar-lg {
  width: 40px !important; height: 40px !important; min-width: 40px !important;
  font-size: .9rem !important;
}

.user-badge-wrap {
  position: relative;
}
.user-badge {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--panel-soft, rgba(255,255,255,.04));
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-radius: 100px;
  padding: 5px 12px 5px 6px;
  cursor: pointer;
  transition: background .2s, border-color .2s;
  color: inherit;
}
.user-badge:hover {
  background: var(--panel, rgba(255,255,255,.08));
  border-color: var(--accent, #3ecfb2);
}
.user-badge-info {
  display: flex; flex-direction: column;
  line-height: 1.25;
  text-align: left;
}
.user-badge-name {
  font-size: .8rem;
  font-weight: 600;
  color: var(--text-strong, #fff);
}
.user-badge-role {
  font-size: .68rem;
  color: var(--accent, #3ecfb2);
}
.user-badge-chevron {
  color: var(--text-secondary, #8892a0);
  transition: transform .2s;
  flex-shrink: 0;
}
.user-badge-wrap.open .user-badge-chevron { transform: rotate(180deg); }

/* Dropdown */
.user-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: 260px;
  background: var(--panel, #1a1f2e);
  border: 1px solid var(--border, rgba(255,255,255,.1));
  border-radius: 14px;
  box-shadow: 0 16px 48px rgba(0,0,0,.4), 0 0 0 1px rgba(255,255,255,.04);
  padding: 6px;
  z-index: 1000;
  animation: dropIn .18s cubic-bezier(.4,0,.2,1) both;
}
@keyframes dropIn {
  from { opacity: 0; transform: translateY(-8px) scale(.97); }
  to   { opacity: 1; transform: none; }
}
.user-dropdown[hidden] { display: none; }

.user-dropdown-header {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 10px;
}
.user-dropdown-identity {
  display: flex; flex-direction: column; gap: 2px; min-width: 0;
}
.user-dropdown-identity strong {
  font-size: .85rem;
  color: var(--text-strong, #fff);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.user-dropdown-identity span {
  font-size: .72rem;
  color: var(--text-secondary, #8892a0);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.user-dropdown-role-pill {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 100px;
  font-size: .65rem !important;
  font-weight: 600;
  background: rgba(62,207,178,.12);
  color: var(--accent, #3ecfb2) !important;
  width: fit-content;
  margin-top: 2px;
}

.user-dropdown-sep {
  height: 1px;
  background: var(--border, rgba(255,255,255,.07));
  margin: 4px 0;
}
.user-dropdown-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 12px;
  border: none;
  background: none;
  color: var(--text, #e2e8f0);
  font-size: .83rem;
  border-radius: 8px;
  cursor: pointer;
  text-align: left;
  transition: background .15s, color .15s;
}
.user-dropdown-item:hover { background: var(--panel-soft, rgba(255,255,255,.05)); }
.user-dropdown-item svg { color: var(--text-secondary, #8892a0); flex-shrink: 0; }
.user-dropdown-item-danger { color: #f87171; }
.user-dropdown-item-danger:hover { background: rgba(239,68,68,.08); }
.user-dropdown-item-danger svg { color: #f87171; }

/* =============================================================
   ADMIN — PANNEAU GESTION UTILISATEURS
   ============================================================= */

.admin-stats-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: var(--sp-3, 12px);
  margin-bottom: var(--sp-5, 20px);
}
.admin-head-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}
.backup-panel {
  margin: 0 0 var(--sp-4, 16px);
}
.backup-panel-inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 14px;
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-radius: var(--r-lg, 12px);
  background: color-mix(in srgb, var(--accent, #3ecfb2) 7%, var(--panel, #fff));
}
.backup-panel-inner strong {
  display: block;
  color: var(--text-strong, #fff);
  font-size: 13px;
  font-weight: 850;
}
.backup-panel-inner span {
  display: block;
  color: var(--text-secondary, #8892a0);
  font-size: 12px;
  font-weight: 650;
  line-height: 1.45;
}
.backup-list-mini {
  display: grid;
  gap: 3px;
  min-width: min(100%, 380px);
  text-align: right;
}
.admin-stat-card {
  background: var(--panel-soft, rgba(255,255,255,.04));
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-radius: var(--r-lg, 12px);
  padding: 16px 20px;
  display: flex; flex-direction: column; gap: 4px;
}
.admin-stat-card strong {
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--text-strong, #fff);
  line-height: 1;
}
.admin-stat-card span {
  font-size: var(--fs-xs, .72rem);
  color: var(--text-secondary, #8892a0);
}
.admin-stat-card.accent strong { color: var(--accent, #3ecfb2); }

.admin-filters {
  display: flex; align-items: center; gap: var(--sp-3, 12px);
  margin-bottom: var(--sp-4, 16px);
  flex-wrap: wrap;
}
.admin-filters input[type="search"] { flex: 1; min-width: 200px; }
.admin-filter-toggle {
  display: flex; align-items: center; gap: 6px;
  font-size: var(--fs-sm, .8rem);
  color: var(--text-secondary, #8892a0);
  cursor: pointer;
  white-space: nowrap;
}

.admin-user-list {
  display: flex; flex-direction: column; gap: var(--sp-3, 12px);
}

.admin-user-card {
  background: var(--panel-soft, rgba(255,255,255,.04));
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-radius: var(--r-lg, 12px);
  padding: 18px 20px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 16px;
  transition: border-color .2s, background .2s;
}
.admin-user-card:hover {
  border-color: var(--border-hover, rgba(255,255,255,.15));
  background: var(--panel, rgba(255,255,255,.06));
}
.admin-user-card.inactive { opacity: .55; }

.admin-user-avatar-wrap { position: relative; }
.admin-user-card .user-avatar { width: 44px; height: 44px; min-width: 44px; font-size: .9rem; }
.admin-user-online-dot {
  position: absolute; bottom: 1px; right: 1px;
  width: 10px; height: 10px;
  border-radius: 50%;
  background: #22c55e;
  border: 2px solid var(--panel-soft, #1a1f2e);
}

.admin-user-info { min-width: 0; }
.admin-user-name {
  font-size: .95rem;
  font-weight: 600;
  color: var(--text-strong, #fff);
  margin: 0 0 2px;
}
.admin-user-email {
  font-size: var(--fs-sm, .8rem);
  color: var(--text-secondary, #8892a0);
  margin-bottom: 6px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.admin-user-meta {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.admin-role-badge {
  display: inline-flex; align-items: center;
  padding: 3px 10px;
  border-radius: 100px;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.admin-role-badge.super_admin { background: rgba(62,207,178,.15); color: #3ecfb2; }
.admin-role-badge.admin        { background: rgba(108,99,255,.15); color: #818cf8; }
.admin-role-badge.chef_projet  { background: rgba(129,140,248,.15); color: #a5b4fc; }
.admin-role-badge.contributeur { background: rgba(245,158,11,.15); color: #fbbf24; }
.admin-role-badge.lecteur      { background: rgba(156,163,175,.12); color: #9ca3af; }
.admin-role-badge.temp-password { background: rgba(245,158,11,.14); color: #fbbf24; }

.user-temp-password-btn {
  width: 100%;
  justify-content: center;
  margin-top: 8px;
}

.admin-user-projects-line {
  font-size: var(--fs-xs, .72rem);
  color: var(--text-muted, rgba(255,255,255,.3));
}
.admin-user-projects-line strong { color: var(--text-secondary, #8892a0); }

.admin-last-login {
  font-size: .68rem;
  color: var(--text-muted, rgba(255,255,255,.25));
}

.admin-user-actions {
  display: flex; gap: 8px; flex-shrink: 0;
}
.admin-user-actions button {
  padding: 7px 14px;
  border-radius: var(--r-md, 8px);
  font-size: var(--fs-xs, .72rem);
  font-weight: 600;
  cursor: pointer;
  border: 1px solid var(--border, rgba(255,255,255,.08));
  background: none;
  color: var(--text-secondary, #8892a0);
  transition: all .15s;
  white-space: nowrap;
}
.admin-user-actions button:hover {
  background: var(--panel-soft, rgba(255,255,255,.06));
  color: var(--text-strong, #fff);
}
.admin-user-actions button.danger { color: #f87171; }
.admin-user-actions button.danger:hover { background: rgba(239,68,68,.1); border-color: rgba(239,68,68,.3); }
.admin-user-actions button.success { color: #4ade80; }

/* Form modal utilisateur */
.modal-sm { max-width: 480px; }
.user-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.user-form-grid label { display: flex; flex-direction: column; gap: 6px; font-size: var(--fs-sm, .8rem); font-weight: 600; color: var(--text-secondary); }
.user-form-grid label.full { grid-column: 1/-1; }
.user-form-grid input, .user-form-grid select { width: 100%; padding: 9px 12px; background: var(--bg-alt, rgba(255,255,255,.04)); border: 1px solid var(--border); border-radius: var(--r-md); color: var(--text); font-size: .85rem; box-sizing: border-box; }

/* Affiliation projets dans modal */
.project-affiliation-picker {
  display: flex; flex-direction: column; gap: 8px;
  max-height: 180px; overflow-y: auto;
  margin-top: 4px;
  padding: 4px 0;
}
.project-affil-item {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px;
  background: var(--panel-soft, rgba(255,255,255,.04));
  border-radius: var(--r-md, 8px);
  border: 1px solid var(--border, rgba(255,255,255,.07));
  cursor: pointer;
  font-size: var(--fs-sm, .8rem);
  transition: background .15s, border-color .15s;
}
.project-affil-item:hover { background: var(--panel, rgba(255,255,255,.08)); }
.project-affil-item.selected { border-color: var(--accent, #3ecfb2); background: rgba(62,207,178,.07); }
.project-affil-item.selected .project-affil-check { background: var(--accent, #3ecfb2); border-color: var(--accent); color: #0f1117; }
.project-affil-check {
  width: 18px; height: 18px; min-width: 18px;
  border: 1.5px solid var(--border, rgba(255,255,255,.15));
  border-radius: 4px;
  display: flex; align-items: center; justify-content: center;
  font-size: .65rem; font-weight: 700;
}
.project-affil-name { font-weight: 600; color: var(--text-strong, #fff); }
.project-affil-code { color: var(--text-secondary, #8892a0); font-size: var(--fs-xs, .72rem); }

/* =============================================================
   MEMBER PICKER — import / création projet
   ============================================================= */

.import-members-block { margin-top: 4px; }
.import-members-label {
  display: block;
  font-size: var(--fs-sm, .8rem);
  font-weight: 600;
  color: var(--text-secondary, #8892a0);
  margin-bottom: 8px;
}

.member-picker {
  background: var(--panel-soft, rgba(255,255,255,.04));
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-radius: var(--r-lg, 12px);
  overflow: hidden;
}
.member-picker-search-row {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border, rgba(255,255,255,.06));
}
.member-picker-search-row input {
  width: 100%;
  background: none;
  border: none;
  color: var(--text, #e2e8f0);
  font-size: .85rem;
  outline: none;
  padding: 0;
  box-sizing: border-box;
}
.member-picker-search-row input::placeholder { color: var(--text-secondary, #8892a0); }

.member-picker-results {
  border-bottom: 1px solid var(--border, rgba(255,255,255,.06));
  max-height: 200px;
  overflow-y: auto;
}
.member-picker-result-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  cursor: pointer;
  transition: background .15s;
}
.member-picker-result-item:hover { background: var(--panel, rgba(255,255,255,.06)); }
.member-picker-result-name { font-size: .85rem; font-weight: 600; color: var(--text-strong, #fff); }
.member-picker-result-role { font-size: var(--fs-xs, .72rem); color: var(--text-secondary, #8892a0); }

.member-picker-selected {
  padding: 10px 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-height: 48px;
  align-content: flex-start;
}
.member-picker-empty {
  font-size: var(--fs-xs, .72rem);
  color: var(--text-muted, rgba(255,255,255,.25));
  font-style: italic;
  padding: 4px 0;
}

.member-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--panel, rgba(255,255,255,.08));
  border: 1px solid var(--border, rgba(255,255,255,.1));
  border-radius: 100px;
  padding: 4px 10px 4px 6px;
  font-size: var(--fs-xs, .72rem);
  animation: chipIn .15s ease both;
}
@keyframes chipIn {
  from { opacity: 0; transform: scale(.85); }
  to   { opacity: 1; transform: none; }
}
.member-chip-name { color: var(--text-strong, #fff); font-weight: 600; }
.member-chip-role {
  font-size: .65rem;
  color: var(--text-secondary, #8892a0);
  white-space: nowrap;
}
.member-chip-role select {
  background: none; border: none; color: var(--text-secondary, #8892a0);
  font-size: .68rem; cursor: pointer; padding: 0; outline: none;
  max-width: 100px;
}
.member-chip-remove {
  background: none; border: none;
  color: var(--text-secondary, #8892a0);
  cursor: pointer; font-size: .9rem; line-height: 1;
  padding: 0; opacity: .7; transition: opacity .15s, color .15s;
  display: flex; align-items: center;
}
.member-chip-remove:hover { opacity: 1; color: #f87171; }

/* Avatars membres sur la carte projet */
.project-card-members {
  display: flex;
  align-items: center;
  gap: -6px;
  margin-top: 8px;
}
.project-card-members .user-avatar {
  width: 24px; height: 24px; min-width: 24px;
  font-size: .6rem;
  border: 2px solid var(--panel-soft, #1a1f2e);
  margin-left: -6px;
}
.project-card-members .user-avatar:first-child { margin-left: 0; }
.project-members-more {
  font-size: .65rem;
  color: var(--text-secondary, #8892a0);
  margin-left: 6px;
}

/* =====================================================================
   SECTION 5 — CONTRATS FONCIERS
   ===================================================================== */

/* Grille principale — 1 colonne (Promesse pleine largeur + trio) */
.lc-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-top: 14px;
}

/* Rangée 3 colonnes égales pour Bail / Servitude / Zone d'intérêt */
.lc-trio {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

/* Sous-carte d'un contrat foncier */
.lc-card {
  background: color-mix(in srgb, var(--panel) 92%, var(--accent) 8%);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* Variante compacte pour la Promesse (pleine largeur) */
.lc-card-compact {
  padding: 10px 14px;
  gap: 8px;
}
.lc-card-compact .lc-card-head {
  margin-bottom: 0;
}

/* En-tête de sous-carte : numéro + titre */
.lc-card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 2px;
}
.lc-card-num {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  min-width: 22px;
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  flex-shrink: 0;
}
.lc-card-head h4 {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-strong);
  margin: 0;
}

/* Corps 2 colonnes de la Promesse compacte : col statut | col champs */
.lc-promesse-body {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: start;
}
.lc-promesse-status-col {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 160px;
}
.lc-promesse-fields-col {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

/* Indicateur statut global du contrat (sous le select Promesse) */
.lc-global-hint {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
}
.lc-hint-label {
  font-size: 10px;
  color: var(--text-muted);
  white-space: nowrap;
}

/* Ligne état de contrat */
.lc-status-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.lc-status-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
}
/* Le select d'état est discret, la pastille fait office d'affichage */
.lc-status-select {
  font-size: 11px !important;
  padding: 2px 5px !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  color: var(--text-muted) !important;
  cursor: pointer;
  flex-shrink: 0;
  border-radius: 5px !important;
}
.lc-status-select:hover,
.lc-status-select:focus { border-color: var(--border) !important; outline: none; }

/* Label compact au-dessus de chaque input */
.lc-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text-muted);
  display: block;
  margin-bottom: 2px;
  white-space: nowrap;
}

/* Conteneur d'un champ label + input */
.lc-field { display: flex; flex-direction: column; gap: 2px; }

/* Valeur calculée automatiquement (Validité = différence de dates) */
.lc-computed {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-strong);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  border: 1px dashed color-mix(in srgb, var(--accent) 40%, transparent);
  border-radius: 7px;
  padding: 5px 8px;
  white-space: nowrap;
}

/* Inputs date et texte */
.lc-input {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 7px;
  color: var(--text-strong);
  font-size: 12px;
  padding: 5px 8px;
  width: 100%;
  box-sizing: border-box;
  transition: border-color .15s;
}
.lc-input:focus { border-color: var(--accent); outline: none; }
.lc-input[type="date"] { font-family: var(--font-mono, monospace); font-size: 11px; }

/* Select standard (pour une éventuelle extension) */
.lc-select {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 7px;
  color: var(--text-strong);
  font-size: 12px;
  padding: 5px 8px;
  width: 100%;
  cursor: pointer;
  box-sizing: border-box;
}

/* Layouts en colonnes */
.lc-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.lc-row-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }

/* Séparateur entre deux blocs de champs */
.lc-divider { border: none; border-top: 1px solid var(--border); margin: 2px 0; }

/* Bloc prolongations */
.lc-extensions-block { display: flex; flex-direction: column; gap: 5px; }
.lc-extensions-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 6px;
}
/* Variante 4 colonnes pour la Promesse compacte */
.lc-extensions-4col {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
}
.lc-ext-card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 8px 10px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.lc-ext-num {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text-muted);
}

/* Responsive — écran moyen */
@media (max-width: 1100px) {
  .lc-trio            { grid-template-columns: 1fr; }
  .lc-row-3           { grid-template-columns: 1fr 1fr; }
  .lc-promesse-body   { grid-template-columns: 1fr; }
  .lc-extensions-4col { grid-template-columns: repeat(2, 1fr); }
}

/* Responsive — petit écran */
@media (max-width: 600px) {
  .lc-row-2,
  .lc-row-3            { grid-template-columns: 1fr; }
  .lc-extensions-grid  { grid-template-columns: 1fr; }
  .lc-extensions-4col  { grid-template-columns: repeat(2, 1fr); }
}