/* MGI Foncier — même famille visuelle que MGI Chantier (jetons, cartes, boutons), accent « terre » */
:root {
  --fond: #F1F0EC; --surface: #FFFFFF; --surface-2: #F7F6F2; --encre: #1E1C17; --gris: #64604F; --gris-clair: #918C79;
  --ligne: #E2DED3; --accent: #6E4B1F; --accent-fort: #563A16; --accent-doux: #F1E6D6; --sur-accent: #FFFFFF;
  --chantier: #0E6169; --signal: #B8660F; --signal-doux: #FBEBD8; --danger: #B23A3A; --danger-doux: #F8E1E1;
  --ok: #2F7D4F; --ok-doux: #DDF1E4; --info: #3C5FD6; --info-doux: #E2E8FB;
  --ombre: 0 1px 2px rgba(30, 28, 23, .06), 0 4px 14px rgba(30, 28, 23, .06); --rayon: 14px;
  --police: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --fond: #13120F; --surface: #1C1A16; --surface-2: #23211C; --encre: #ECE8DE; --gris: #A9A391; --gris-clair: #7B7666;
    --ligne: #2F2C25; --accent: #D9A866; --accent-fort: #E8C08A; --accent-doux: #3A2C18; --sur-accent: #13120F;
    --chantier: #4FB3BC; --signal: #E2A35B; --signal-doux: #33240F; --danger: #E57373; --danger-doux: #3A1818;
    --ok: #6CC490; --ok-doux: #15301F; --info: #8EA6F2; --info-doux: #1D2540; --ombre: 0 1px 2px rgba(0,0,0,.4); color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --fond: #13120F; --surface: #1C1A16; --surface-2: #23211C; --encre: #ECE8DE; --gris: #A9A391; --gris-clair: #7B7666;
  --ligne: #2F2C25; --accent: #D9A866; --accent-fort: #E8C08A; --accent-doux: #3A2C18; --sur-accent: #13120F;
  --chantier: #4FB3BC; --signal: #E2A35B; --signal-doux: #33240F; --danger: #E57373; --danger-doux: #3A1818;
  --ok: #6CC490; --ok-doux: #15301F; --info: #8EA6F2; --info-doux: #1D2540; --ombre: 0 1px 2px rgba(0,0,0,.4); color-scheme: dark;
}
* { box-sizing: border-box; }
html, body { height: 100%; }
body { margin: 0; background: var(--fond); color: var(--encre); font: 15px/1.45 var(--police); -webkit-font-smoothing: antialiased; }
button, input, textarea, select { font: inherit; color: inherit; }
a { color: var(--accent); }
img { max-width: 100%; display: block; }
[hidden] { display: none !important; }
h1, h2, h3 { line-height: 1.2; margin: 0 0 .4em; }
h1 { font-size: 22px; } h2 { font-size: 17px; } h3 { font-size: 15px; }
.petit { font-size: 13px; color: var(--gris); }
.muet { color: var(--gris); }
.num { font-variant-numeric: tabular-nums; }

/* démarrage, connexion */
.demarrage, .connexion { min-height: 100vh; display: grid; place-items: center; padding: 16px; }
.logo-rond { width: 60px; height: 60px; border-radius: 17px; background: var(--accent); color: var(--sur-accent); display: grid;
  place-items: center; font-weight: 800; letter-spacing: .04em; font-size: 15px; }
.carte-connexion { width: min(420px, 100%); background: var(--surface); border: 1px solid var(--ligne); border-radius: 18px; padding: 26px;
  box-shadow: var(--ombre); display: grid; gap: 14px; }
.carte-connexion .tete { display: flex; gap: 12px; align-items: center; }

/* mise en page */
.appli { display: grid; grid-template-columns: 236px 1fr; min-height: 100vh; }
.menu { background: var(--surface); border-right: 1px solid var(--ligne); padding: 16px 12px; display: flex; flex-direction: column; gap: 4px;
  position: sticky; top: 0; height: 100vh; overflow: auto; }
.menu .marque { display: flex; gap: 10px; align-items: center; padding: 4px 6px 14px; }
.menu .marque b { display: block; font-size: 16px; }
.menu a { display: flex; gap: 10px; align-items: center; padding: 9px 10px; border-radius: 10px; color: var(--encre); text-decoration: none; }
.menu a:hover { background: var(--surface-2); }
.menu a.actif { background: var(--accent-doux); color: var(--accent-fort); font-weight: 600; }
.menu .sep { height: 1px; background: var(--ligne); margin: 10px 4px; }
.menu .bas { margin-top: auto; display: grid; gap: 4px; }
.ico { width: 18px; text-align: center; opacity: .85; }
.contenu { padding: 22px 26px 60px; min-width: 0; }
.entete-page { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; justify-content: space-between; margin-bottom: 16px; }
.entete-page .gauche { min-width: 0; }
.fil { font-size: 13px; color: var(--gris); margin-bottom: 4px; }
.fil a { color: var(--gris); }
@media (max-width: 860px) {
  .appli { grid-template-columns: 1fr; }
  .menu { position: fixed; inset: auto 0 0 0; height: auto; flex-direction: row; overflow-x: auto; border-right: 0; border-top: 1px solid var(--ligne);
    padding: 6px; z-index: 900; }
  .menu .marque, .menu .sep, .menu .libelle-long { display: none; }
  .menu .bas { margin: 0; display: flex; }
  .menu a { flex-direction: column; gap: 2px; font-size: 11px; padding: 6px 9px; white-space: nowrap; }
  .contenu { padding: 16px 16px 90px; }
}

/* blocs */
.carte { background: var(--surface); border: 1px solid var(--ligne); border-radius: var(--rayon); padding: 16px; box-shadow: var(--ombre); min-width: 0; }
.carte + .carte { margin-top: 14px; }
.carte h2 { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.grille { display: grid; gap: 14px; }
.g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.g4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .g3, .g4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .g2, .g3, .g4 { grid-template-columns: 1fr; } }
.tuile { background: var(--surface); border: 1px solid var(--ligne); border-radius: var(--rayon); padding: 12px 14px; }
.tuile .v { font-size: 26px; font-weight: 700; font-variant-numeric: tabular-nums; }
.tuile .l { font-size: 13px; color: var(--gris); }
.vide { color: var(--gris); padding: 10px 0; }
.liste { display: grid; gap: 8px; }
.ligne-item { display: flex; gap: 12px; align-items: flex-start; justify-content: space-between; padding: 10px 12px; border: 1px solid var(--ligne);
  border-radius: 12px; background: var(--surface-2); }
.ligne-item .corps { min-width: 0; }
.ligne-item a.titre { font-weight: 600; text-decoration: none; color: var(--encre); }

/* boutons, champs */
.btn { display: inline-flex; gap: 6px; align-items: center; justify-content: center; border: 1px solid var(--ligne); background: var(--surface);
  border-radius: 10px; padding: 8px 13px; cursor: pointer; text-decoration: none; color: var(--encre); white-space: nowrap; }
.btn:hover { border-color: var(--gris-clair); }
.btn.principal { background: var(--accent); border-color: var(--accent); color: var(--sur-accent); font-weight: 600; }
.btn.principal:hover { background: var(--accent-fort); }
.btn.danger { color: var(--danger); }
.btn.petit { padding: 5px 9px; font-size: 13px; }
.btn:disabled { opacity: .55; cursor: default; }
.actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
label.champ { display: grid; gap: 4px; font-size: 13px; color: var(--gris); min-width: 0; }
label.champ > span { font-weight: 600; }
input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], input[type=search], select, textarea {
  width: 100%; border: 1px solid var(--ligne); border-radius: 10px; padding: 8px 10px; background: var(--surface); color: var(--encre); min-width: 0; }
textarea { min-height: 72px; resize: vertical; }
input:focus, select:focus, textarea:focus, .btn:focus-visible, a:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.formulaire { display: grid; gap: 12px; }
.formulaire .g2, .formulaire .g3 { gap: 12px; }
.erreur { background: var(--danger-doux); color: var(--danger); border-radius: 10px; padding: 8px 10px; font-size: 14px; }
.note { background: var(--signal-doux); color: var(--encre); border-radius: 10px; padding: 10px 12px; font-size: 14px; }
.note.info { background: var(--info-doux); }

/* pastilles */
.pastille { display: inline-flex; align-items: center; gap: 4px; border-radius: 999px; padding: 2px 9px; font-size: 12px; font-weight: 600;
  background: var(--surface-2); color: var(--gris); border: 1px solid var(--ligne); white-space: nowrap; }
.pastille.ok, .pastille.conforme { background: var(--ok-doux); color: var(--ok); border-color: transparent; }
.pastille.ko, .pastille.non_conforme { background: var(--danger-doux); color: var(--danger); border-color: transparent; }
.pastille.av, .pastille.a_verifier { background: var(--signal-doux); color: var(--signal); border-color: transparent; }
.pastille.accent { background: var(--accent-doux); color: var(--accent-fort); border-color: transparent; }
.pastille.info { background: var(--info-doux); color: var(--info); border-color: transparent; }

/* onglets */
.onglets { display: flex; gap: 4px; overflow-x: auto; border-bottom: 1px solid var(--ligne); margin: 4px 0 16px; }
.onglets a { padding: 9px 12px; text-decoration: none; color: var(--gris); border-bottom: 2px solid transparent; white-space: nowrap; }
.onglets a.actif { color: var(--accent-fort); border-bottom-color: var(--accent); font-weight: 600; }

/* tableaux */
.tableau-wrap { overflow-x: auto; border: 1px solid var(--ligne); border-radius: 12px; }
table { width: 100%; border-collapse: collapse; font-size: 14px; }
th, td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--ligne); vertical-align: top; }
th { background: var(--surface-2); font-size: 12px; color: var(--gris); font-weight: 600; position: sticky; top: 0; }
tr:last-child td { border-bottom: 0; }
td.n, th.n { text-align: right; font-variant-numeric: tabular-nums; }

/* kanban */
.kanban { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(220px, 1fr); gap: 10px; overflow-x: auto; padding-bottom: 6px; }
.colonne { background: var(--surface-2); border: 1px solid var(--ligne); border-radius: 12px; padding: 8px; display: grid; gap: 8px; align-content: start; }
.colonne h3 { font-size: 13px; color: var(--gris); display: flex; justify-content: space-between; margin: 2px 4px 2px; }
.carte-prospect { background: var(--surface); border: 1px solid var(--ligne); border-radius: 10px; padding: 9px 10px; display: grid; gap: 4px;
  text-decoration: none; color: var(--encre); }
.carte-prospect:hover { border-color: var(--accent); }

/* carte et 3D */
.carte-geo { height: 420px; border-radius: 12px; overflow: hidden; border: 1px solid var(--ligne); }
.carte-geo.haute { height: calc(100vh - 160px); min-height: 420px; }
.vue3d { position: relative; height: 560px; border-radius: 12px; overflow: hidden; border: 1px solid var(--ligne); background: #EEF1EF; }
.vue3d canvas { display: block; width: 100%; height: 100%; }
.vue3d .barre { position: absolute; left: 10px; top: 10px; right: 10px; display: flex; flex-wrap: wrap; gap: 6px; pointer-events: none; }
.vue3d .barre > * { pointer-events: auto; }
.vue3d .info { position: absolute; left: 10px; bottom: 10px; max-width: min(380px, calc(100% - 20px)); background: rgba(255,255,255,.94);
  color: #1E1C17; border-radius: 10px; padding: 10px 12px; font-size: 13px; box-shadow: var(--ombre); }
.vue3d .chargement { position: absolute; inset: 0; display: grid; place-items: center; color: #555; }
.legende { display: flex; flex-wrap: wrap; gap: 6px 12px; font-size: 13px; margin-top: 8px; }
.legende label { display: inline-flex; gap: 5px; align-items: center; cursor: pointer; }
.legende i { width: 11px; height: 11px; border-radius: 3px; display: inline-block; }
.plan-image { border: 1px solid var(--ligne); border-radius: 12px; background: #fff; cursor: zoom-in; }

/* contrôle */
.synthese-ctrl { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 12px; }
.ctrl-ligne td:first-child { white-space: nowrap; }
.ctrl-ligne .texte-regle { font-size: 12px; color: var(--gris); margin-top: 3px; }
.ctrl-ligne textarea { min-height: 52px; font-size: 13px; field-sizing: content; max-height: 260px; }
.ctrl-ligne td.avis { min-width: 320px; }
.ctrl-ligne td.avis textarea + textarea { margin-top: 6px; }
.ctrl-ligne td.lots-ko { max-width: 190px; }
.ctrl-ligne td.lots-ko summary { cursor: pointer; font-weight: 600; color: var(--danger); }
.ctrl-ligne td.lots-ko details div { margin-top: 4px; }
select.choix-statut { min-width: 132px; font-weight: 600; font-size: 13px; padding: 5px 8px; }
select.choix-statut.conforme { background: var(--ok-doux); color: var(--ok); }
select.choix-statut.non_conforme { background: var(--danger-doux); color: var(--danger); }
select.choix-statut.a_verifier { background: var(--signal-doux); color: var(--signal); }

/* toasts, fenêtres */
#toasts { position: fixed; right: 16px; bottom: 16px; display: grid; gap: 8px; z-index: 2000; }
.toast { background: var(--encre); color: var(--fond); padding: 10px 14px; border-radius: 10px; box-shadow: var(--ombre); max-width: 360px; }
.toast.erreur-t { background: var(--danger); color: #fff; }
dialog { border: 1px solid var(--ligne); border-radius: 16px; padding: 0; width: min(640px, calc(100vw - 32px)); background: var(--surface); color: var(--encre); }
dialog::backdrop { background: rgba(0,0,0,.35); }
dialog .dlg-tete { padding: 14px 16px; border-bottom: 1px solid var(--ligne); display: flex; justify-content: space-between; align-items: center; }
dialog .dlg-corps { padding: 16px; max-height: 70vh; overflow: auto; }
dialog .dlg-pied { padding: 12px 16px; border-top: 1px solid var(--ligne); display: flex; justify-content: flex-end; gap: 8px; }
.copie { display: flex; gap: 8px; }
.copie input { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12px; }
.chrono { border-left: 2px solid var(--ligne); margin-left: 6px; padding-left: 14px; display: grid; gap: 12px; }
.chrono .evt { position: relative; }
.chrono .evt::before { content: ""; position: absolute; left: -20px; top: 6px; width: 10px; height: 10px; border-radius: 50%; background: var(--accent); }
.depot { border: 2px dashed var(--ligne); border-radius: 12px; padding: 16px; text-align: center; color: var(--gris); }
.depot.survol { border-color: var(--accent); background: var(--accent-doux); }
@media print { .menu, .actions, .onglets { display: none !important; } .appli { display: block; } .carte { box-shadow: none; } }

/* bilan */
.ligne-item.recette { display: block; }
.recette-tete { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: end; margin-bottom: 6px; }
.recette-tete .case { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; padding-bottom: 9px; white-space: nowrap; }
.tuiles-bilan .tuile .v { white-space: nowrap; font-size: clamp(16px, 1.45vw, 24px); }
td.n, th.n { white-space: nowrap; }

/* ---------------------------------------------------------------- 1.1 : recherche foncière */
.case { display: inline-flex; gap: 6px; align-items: center; font-size: 14px; color: var(--encre); cursor: pointer; }
.cases { display: flex; flex-wrap: wrap; gap: 6px 16px; }
.note.ko { background: var(--danger-doux); color: var(--danger); }
.carte h2 .actions { margin-left: auto; }
.carte-geo.moyenne { height: min(520px, 60vh); }
dialog.large { width: min(1080px, calc(100vw - 24px)); }
dialog.large .dlg-corps { max-height: 78vh; }
.fiche-tete { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; flex-wrap: wrap; }
.grille-fiche { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 12px; margin-top: 12px; }
.bloc-fiche { border: 1px solid var(--ligne); border-radius: 12px; padding: 10px 12px; background: var(--surface-2); min-width: 0; }
.fiche-parcelle > .bloc-fiche { margin-top: 12px; }
.bloc-fiche h3 { margin: 0 0 6px; font-size: 14px; color: var(--accent-fort); }
.bloc-fiche p { margin: 6px 0; }
.kv { display: flex; justify-content: space-between; gap: 10px; font-size: 14px; padding: 2px 0; border-bottom: 1px dashed var(--ligne); }
.kv span { color: var(--gris); }
.kv b { text-align: right; font-weight: 600; overflow-wrap: anywhere; }
.grand { font-size: 22px; font-weight: 700; font-variant-numeric: tabular-nums; margin: 4px 0; }
.puces { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0; }
.puce { font-size: 12px; background: var(--surface); border: 1px solid var(--ligne); border-radius: 999px; padding: 2px 8px; }
.barre-progression { height: 8px; border-radius: 99px; background: var(--surface-2); border: 1px solid var(--ligne); overflow: hidden; margin-top: 8px; }
.barre-progression i { display: block; height: 100%; background: var(--accent); transition: width .4s; }
.barre-progression.indet::after { content: ""; display: block; height: 100%; width: 30%; background: var(--accent); animation: indet 1.2s ease-in-out infinite; }
@keyframes indet { 0% { transform: translateX(-100%); } 100% { transform: translateX(340%); } }
.score { display: inline-block; min-width: 34px; text-align: center; color: #fff; font-weight: 700; border-radius: 8px; padding: 2px 6px; font-variant-numeric: tabular-nums; }
.legende-score { display: flex; gap: 14px; flex-wrap: wrap; font-size: 13px; margin-top: 8px; color: var(--gris); }
.legende-score i { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
.ico-alerte { width: 30px; height: 30px; flex: 0 0 30px; border-radius: 50%; display: grid; place-items: center; background: var(--accent-doux); color: var(--accent-fort); font-weight: 700; }
.ligne-item.lue { opacity: .6; }
.menu a .badge { margin-left: auto; background: var(--danger); color: #fff; border-radius: 999px; font-size: 11px; font-weight: 700; padding: 1px 7px; }
.cond { display: grid; grid-template-columns: 1fr 150px 120px auto; gap: 6px; align-items: center; }
.popup-parcelle { min-width: 190px; }
.popup-parcelle .btn { color: var(--encre); }
.popup-parcelle .btn.principal { color: var(--sur-accent); }
details summary { cursor: pointer; }
@media (max-width: 700px) { .cond { grid-template-columns: 1fr 1fr; } .kv { flex-direction: column; gap: 0; } .kv b { text-align: left; } }
.grille > .carte + .carte, .grille > div > .carte:first-child { margin-top: 0; }