/* LOBISO — charte graphique (octobre 2026) : bleu nuit #0B2545, orange #E8731A */
/* ============================================================
   LOBISO — système de design (charte graphique, août 2026)
   ============================================================ */
:root{
  --ink:#0B2545;
  --ink-2:#1C3A5E;
  --terracotta:#E8731A;
  --terracotta-d:#C25D10;
  --verified:#33684A;
  --amber:#B9862E;
  --paper:#EFE7D5;
  --stone:#867A68;
  --page:#F6F2E8;
  --white:#fff;
  --line:#E6DFD1;
  --line-soft:#F0EADD;
  --land:#DCCEAC;
  --land-2:#CBBA92;

  --serif:'IBM Plex Serif',Georgia,'Times New Roman',serif;
  --sans:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  --r:6px;
  --shadow:0 1px 2px rgba(11,37,69,.05);
  --wrap:1180px;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--page);color:var(--ink);
  font:400 15px/1.6 var(--sans);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;margin:0;letter-spacing:-.01em;line-height:1.15}
h1{font-size:40px}
h2{font-size:27px}
h3{font-size:20px}
h4{font-size:16px}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
:focus-visible{outline:2px solid var(--terracotta);outline-offset:2px;border-radius:2px}

/* --- rôles typographiques --- */
.sub{font-size:20px;font-weight:500;color:var(--ink)}
.meta{font-size:11px;color:var(--stone)}
.lead{font-size:16px;color:var(--stone);max-width:62ch}
.data{font-family:var(--mono);font-size:13px;letter-spacing:-.01em}
.ref{font-family:var(--mono);font-size:12px;color:var(--stone)}
.price{font-family:var(--mono);font-size:17px;color:var(--terracotta-d);font-weight:500}
.muted{color:var(--stone)}

/* --- layout --- */
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px}
.screen{display:none}
.screen.is-active{display:block}
.page-head{padding:40px 0 26px}
.page-head h1{margin-bottom:6px}
.grid{display:grid;gap:18px}
.row{display:flex;align-items:center;gap:12px}
.spread{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-wrap:wrap}

/* --- surfaces --- */
.card{background:var(--white);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
.card-pad{padding:22px}
.panel-head{padding:16px 22px;border-bottom:1px solid var(--line-soft);display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.panel-head h3{font-size:17px}
.rowitem{display:flex;align-items:center;gap:16px;padding:14px 22px;border-bottom:1px solid var(--line-soft)}
.rowitem:last-child{border-bottom:0}

/* --- boutons --- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-size:13px;font-weight:500;padding:11px 18px;border-radius:var(--r);
  border:1px solid transparent;background:none;cursor:pointer;text-decoration:none;
  transition:background .15s ease,border-color .15s ease,color .15s ease;
}
.btn--primary{background:var(--terracotta-d);color:#fff}
.btn--primary:hover{background:#A34B0B}
.btn--ghost{background:var(--white);border-color:var(--ink);color:var(--ink)}
.btn--ghost:hover{background:var(--paper)}
.btn--quiet{border-color:var(--line);background:var(--white);color:var(--ink)}
.btn--quiet:hover{border-color:var(--stone)}
.btn--go{background:var(--verified);color:#fff}
.btn--go:hover{background:#2A5A3E}
.btn--sm{padding:8px 13px;font-size:12px}
.btn--wide{width:100%}
.linky{background:none;border:0;padding:0;cursor:pointer;font-size:13px;font-weight:500;color:var(--terracotta-d);text-decoration:underline;text-underline-offset:3px}

/* --- statuts --- */
.pill{display:inline-block;font-size:11px;font-weight:500;padding:5px 10px;border-radius:20px;white-space:nowrap}
.pill--v{background:#E7EFE9;color:var(--verified)}
.pill--a{background:#F6EEDC;color:#8A6420}
.pill--l{background:#EFEBE3;color:var(--stone)}
.pill--t{background:#F6E7DF;color:var(--terracotta-d)}

/* --- échelle de vérification (composant unique) --- */
.scale{display:flex;gap:4px;align-items:center}
.scale i{display:block;width:22px;height:4px;border-radius:2px;background:var(--land)}
.scale i.on{background:var(--verified)}
.scale--sm i{width:16px;height:3px}

.scaleboard{display:flex;gap:0;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:14px}
.step{flex:1;min-width:112px;text-align:center}
.step b{
  display:flex;align-items:center;justify-content:center;width:26px;height:26px;margin:0 auto 8px;
  border-radius:50%;font-family:var(--mono);font-size:12px;font-weight:500;
  background:var(--verified);color:#fff;
}
.step.off b{background:transparent;color:var(--stone);border:1px solid var(--land-2)}
.step span{font-size:12px;font-weight:500;display:block}
.step.off span{color:var(--stone);font-weight:400}
.step em{display:block;font-style:normal;font-size:11px;color:var(--stone);margin-top:4px;line-height:1.45}

/* --- preuve horodatée --- */
.proof{position:relative;border-radius:var(--r);overflow:hidden;background:linear-gradient(160deg,var(--land),var(--land-2))}
.proof::after{content:"";display:block;padding-bottom:66%}
.proof .stamp{
  position:absolute;left:0;right:0;bottom:0;background:rgba(11,37,69,.9);color:#fff;
  font-family:var(--mono);font-size:11px;line-height:1.5;padding:7px 10px;
}
.proof .tag{
  position:absolute;top:9px;left:9px;background:rgba(11,37,69,.88);color:#fff;
  font-family:var(--mono);font-size:11px;padding:4px 8px;border-radius:3px;
}
.thumb{background:linear-gradient(160deg,var(--land),var(--land-2));border-radius:4px;flex:none}

/* --- formulaires --- */
.field{display:block;margin-bottom:18px}
.field span{display:block;font-size:11px;color:var(--stone);margin-bottom:5px}
.field input,.field select,.field textarea{
  width:100%;font:400 15px var(--sans);color:var(--ink);background:transparent;
  border:0;border-bottom:1px solid var(--line);padding:7px 0;border-radius:0;
}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-bottom-color:var(--terracotta)}
.check{display:flex;align-items:center;gap:10px;padding:5px 0;font-size:14px;cursor:pointer}
.check input{appearance:none;width:16px;height:16px;border:1px solid var(--land-2);border-radius:3px;background:var(--white);cursor:pointer;flex:none;position:relative}
.check input:checked{background:var(--verified);border-color:var(--verified)}
.check input:checked::after{content:"";position:absolute;left:5px;top:1.5px;width:4px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(42deg)}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:3px;background:var(--land);border-radius:3px;outline:0}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:15px;height:15px;border-radius:50%;background:var(--white);border:2px solid var(--terracotta);cursor:pointer}
input[type=range]::-moz-range-thumb{width:15px;height:15px;border-radius:50%;background:var(--white);border:2px solid var(--terracotta);cursor:pointer}
.fieldset-title{font-size:13px;font-weight:600;margin:0 0 8px}

/* --- barre de navigation publique --- */
.topbar{background:var(--white);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
.topbar .wrap{display:flex;align-items:center;gap:26px;height:72px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;flex:none}
.brand img{height:46px;width:auto;display:block}
.foot .brand img{height:auto;width:220px}
.nav{display:flex;gap:18px;margin:0 auto}
.nav a{white-space:nowrap;font-size:14px;text-decoration:none;color:var(--ink);padding:6px 0;border-bottom:2px solid transparent}
.nav a:hover{border-bottom-color:var(--land-2)}
.nav a.on{border-bottom-color:var(--terracotta)}
.topbar .auth{display:flex;align-items:center;gap:16px;flex:none}
.burger{display:none;margin-left:auto;background:none;border:1px solid var(--line);border-radius:var(--r);padding:9px 11px;cursor:pointer}

/* --- pied de page --- */
.foot{background:var(--ink);color:#C9D2DA;margin-top:70px;padding:46px 0 30px}
.foot h4{color:#fff;font-size:14px;font-family:var(--sans);font-weight:600;margin-bottom:12px}
.foot a{display:block;color:#C9D2DA;text-decoration:none;font-size:13px;padding:4px 0}
.foot a:hover{color:#fff}
.foot .cols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:34px}
.foot .rule{border-top:1px solid rgba(255,255,255,.13);margin-top:34px;padding-top:20px;font-size:11px;color:#8FA0AE;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* --- espaces authentifiés --- */
.space{display:none;min-height:100vh;grid-template-columns:210px 1fr}
.space.is-active{display:grid}
.side{background:var(--ink);color:#fff;padding-bottom:30px}
.side .logo{display:block;padding:22px 20px;border-bottom:1px solid rgba(255,255,255,.1);border-left:0}
.side .logo:hover{background:none}
.side .logo img{width:168px;height:auto;display:block}
.side .who{font-size:11px;color:#8FA0AE;padding:18px 20px 10px;letter-spacing:.06em}
.side a{display:block;padding:11px 20px;font-size:14px;color:#D6DEE5;text-decoration:none;border-left:3px solid transparent}
.side a:hover{background:var(--ink-2);color:#fff}
.side a.on{background:var(--ink-2);color:#fff;border-left-color:var(--terracotta);font-weight:500}
.side .back{margin-top:22px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1)}
.space main{padding:34px 34px 60px;min-width:0}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:16px}
.kpi{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px}
.kpi b{display:block;font-family:var(--mono);font-size:26px;font-weight:500;letter-spacing:-.02em}
.kpi span{display:block;font-size:12px;color:var(--stone);margin-top:5px}
.kpi em{display:block;font-style:normal;font-size:11px;color:var(--verified);margin-top:8px}

/* --- tableaux --- */
table{width:100%;border-collapse:collapse}
th{font-size:11px;font-weight:500;color:var(--stone);text-align:left;padding:11px 22px;border-bottom:1px solid var(--line-soft)}
td{padding:13px 22px;border-bottom:1px solid var(--line-soft);font-size:14px;vertical-align:middle}
tr:last-child td{border-bottom:0}

/* --- avertissement réglementaire --- */
.notice{background:var(--paper);border-left:3px solid var(--terracotta);border-radius:0 var(--r) var(--r) 0;padding:16px 20px;font-size:13px;color:#4A4136;line-height:1.65}

@media (max-width:1180px){
  .nav a{font-size:13px}
}
@media (max-width:1000px){
  .nav{display:none}
  .topbar .auth{display:none}
  .burger{display:block}
  .topbar .wrap{height:64px}
  .nav.open{display:flex;position:absolute;left:0;right:0;top:64px;background:var(--white);border-bottom:1px solid var(--line);flex-direction:column;gap:0;padding:8px 28px 18px;margin:0}
  .nav.open a{padding:11px 0;border-bottom:1px solid var(--line-soft)}
  .foot .cols{grid-template-columns:1fr 1fr}
  .space{grid-template-columns:minmax(0,1fr)}
  .side{min-width:0}
  .side{display:flex;flex-wrap:wrap;align-items:center;padding:0 12px 10px}
  .side .logo,.side .who{border:0;padding:14px 10px}
  .side .logo img{width:120px}
  .side{padding-bottom:6px}
  #espaceMenu{display:flex;width:100%;overflow-x:auto;order:3;border-top:1px solid rgba(255,255,255,.1)}
  #espaceMenu a{white-space:nowrap;flex:none}
  .side .back{display:flex;margin-left:auto!important}
  .side .back a{padding:9px 8px;font-size:12px}
  .side a{border-left:0;border-bottom:3px solid transparent;padding:9px 10px}
  .side a.on{border-left-color:transparent;border-bottom-color:var(--terracotta)}
  .side .back{margin:0;padding:0;border:0}
  .space main{padding:24px 20px 50px}
}
@media (max-width:860px){
  #searchGrid,#heroGrid,#tGrid,#conGrid,#methGrid,#partGrid{grid-template-columns:1fr!important;gap:20px!important}
  #searchGrid aside,#tGrid aside{position:static!important}
  #heroGrid{padding-top:38px!important;padding-bottom:38px!important}
  .tcard{grid-template-columns:1fr!important}
  .tcard .proof::after{padding-bottom:46%}
  .rowitem{flex-wrap:wrap;row-gap:8px}
  .scaleboard{gap:18px}
  .step{min-width:44%;text-align:left}
  .step b{margin:0 0 6px}
  .kpi b{font-size:22px}
  .foot .cols{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  h1{font-size:29px}h2{font-size:22px}
  .wrap{padding:0 18px}
  .page-head{padding:26px 0 18px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ============================================================
   Ajouts de l'application connectée à l'API
   ============================================================ */
.auth-wrap{max-width:420px;margin:60px auto 0}
.comptes{background:var(--paper);border-radius:var(--r);padding:16px 18px;margin-top:18px}
.comptes button{display:flex;width:100%;justify-content:space-between;gap:12px;background:none;border:0;
  border-bottom:1px solid var(--land);padding:9px 0;cursor:pointer;font-size:13px;text-align:left}
.comptes button:last-child{border-bottom:0}
.comptes button:hover{color:var(--terracotta-d)}
.comptes .data{color:var(--stone)}

.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:200;
  background:var(--ink);color:#fff;font-size:14px;padding:13px 20px;border-radius:var(--r);
  box-shadow:0 8px 24px rgba(11,37,69,.25);max-width:min(560px,92vw)}
.toast.err{background:var(--terracotta-d)}

.chargement{padding:40px 0;text-align:center;color:var(--stone);font-size:14px}
.vide{padding:26px 22px;color:var(--stone);font-size:14px}
.palier{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-bottom:1px solid var(--line-soft)}
.palier:last-child{border-bottom:0}
.palier .marque{width:20px;height:20px;border-radius:50%;flex:none;display:grid;place-items:center;
  font-size:11px;font-family:var(--mono);background:var(--verified);color:#fff}
.palier.manque .marque{background:transparent;border:1px solid var(--land-2);color:var(--stone)}
.avatar{width:36px;height:36px;border-radius:50%;background:var(--paper);display:grid;place-items:center;
  font-family:var(--serif);font-size:14px;flex:none}
.fil{max-height:320px;overflow:auto;padding:6px 22px}
.bulle{background:var(--paper);border-radius:var(--r);padding:10px 13px;margin:10px 0;max-width:80%;font-size:14px}
.bulle.moi{background:var(--ink);color:#fff;margin-left:auto}
.bulle .meta{color:inherit;opacity:.65;margin-top:5px}
.badge-nb{background:var(--terracotta);color:#fff;border-radius:20px;font-size:10px;padding:2px 7px;margin-left:6px}

/* --- réseaux sociaux --- */
.reseaux{display:flex;gap:10px;flex-wrap:wrap}
.reseaux a{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;
  border:1px solid var(--line);background:var(--white);color:var(--ink);transition:background .15s ease,color .15s ease}
.reseaux a:hover{background:var(--ink);color:#fff}
.foot .reseaux a{border-color:rgba(255,255,255,.22);background:transparent;color:#C9D2DA;padding:0}
.foot .reseaux a:hover{background:#fff;color:var(--ink)}

/* --- sélecteur de mode de financement --- */
#modes button{border:1px solid var(--line);transition:border-color .15s ease}
#modes button:hover{border-color:var(--stone)}
#modes button.actif{border-color:var(--terracotta);box-shadow:inset 0 0 0 1px var(--terracotta)}
#modes button.actif h3::after{content:" ✓";color:var(--verified);font-family:var(--sans);font-size:15px}

/* ============================================================
   LOBISO — rubriques des tableaux de bord, messagerie, back-office
   ============================================================ */
.rub-head{margin-bottom:22px}
.rub-head h1{font-size:30px}
.rub-head p{font-size:14px;margin-top:6px;max-width:70ch}
.texte-rubrique p{max-width:72ch;font-size:15px}
.side .who{line-height:1.6}
.side a[data-rub]{display:flex;align-items:center;justify-content:space-between;gap:8px}

.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0 20px}
.inp{font:400 14px var(--sans);color:var(--ink);background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:8px 10px;min-width:0}
.inp:focus{outline:0;border-color:var(--terracotta)}
.inp.num{width:84px;text-align:right;font-family:var(--mono);font-size:13px}
textarea.inp{resize:vertical;line-height:1.5}
td .inp{padding:6px 8px}

.tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px;border-bottom:1px solid var(--line)}
.tabs button{background:none;border:0;border-bottom:2px solid transparent;padding:9px 12px;cursor:pointer;font-size:14px;color:var(--stone);margin-bottom:-1px}
.tabs button b{font-family:var(--mono);font-weight:500;font-size:12px;margin-left:4px}
.tabs button.on{color:var(--ink);border-bottom-color:var(--terracotta);font-weight:500}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;gap:8px;align-items:center;padding:7px 12px;border:1px solid var(--line);border-radius:20px;font-size:13px;text-decoration:none;background:var(--white)}
.chip b{font-family:var(--mono);font-weight:500}
.chip:hover{border-color:var(--stone)}
.chip--t{border-color:#EDC9B6;color:var(--terracotta-d)}
.barre{height:6px;background:var(--land);border-radius:3px;margin:18px 0 0;overflow:hidden}
.barre i{display:block;height:100%;background:var(--verified)}
tr.eteint td{opacity:.55}

/* messagerie : participant ↔ LOBISO */
.msg-grid{display:grid;grid-template-columns:300px 1fr;gap:20px;align-items:start}
.conv{display:block;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--line-soft);padding:13px 18px;cursor:pointer;font-size:14px}
.conv:hover{background:var(--page)}
.conv.on{background:var(--paper);box-shadow:inset 3px 0 0 var(--terracotta)}
.conv .ref{display:block}
.composer{display:flex;gap:10px;align-items:flex-end;padding:14px 22px;border-top:1px solid var(--line-soft)}
.composer textarea{flex:1;font:400 14px var(--sans);border:1px solid var(--line);border-radius:var(--r);padding:9px 11px;resize:vertical}
.composer textarea:focus{outline:0;border-color:var(--terracotta)}
.fil{min-height:160px}
.relais{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line-soft)}
.rowbtn{width:100%;background:none;border:0;border-bottom:1px solid var(--line-soft);cursor:pointer;font:inherit}
.rowbtn:hover{background:var(--page)}

/* parties prenantes */
.fiche-grid{display:grid;grid-template-columns:1.2fr 1fr}

/* rubriques */
.rub-grid{display:grid;grid-template-columns:1fr 240px;gap:20px;align-items:start}
.rub-ligne .ordre{display:flex;flex-direction:column;gap:4px}
.rub-ligne .ordre .btn{padding:4px 9px}
.apercu-menu{background:var(--ink);border-radius:var(--r);padding:16px 0;position:sticky;top:20px}
.apercu-menu div{padding:9px 18px;font-size:13px;color:#D6DEE5;border-left:3px solid transparent}
.apercu-menu div.on{background:var(--ink-2);color:#fff;border-left-color:var(--terracotta)}
.apercu-menu p{padding:0 18px}

/* « LOBISO, votre seul interlocuteur » */
.focal{display:grid;grid-template-columns:1.3fr 1fr;align-items:center;gap:10px;overflow:hidden}
.focal-texte{padding:26px}
.focal-schema{position:relative;height:260px;background:var(--paper)}
.focal-schema .centre{position:absolute;left:50%;top:50%;width:76px;height:76px;transform:translate(-50%,-50%);background:#fff;border-radius:50%;padding:10px;box-shadow:0 0 0 6px rgba(232,115,26,.18)}
.focal-schema .n{position:absolute;font-size:12px;font-weight:500;background:#fff;border:1px solid var(--line);border-radius:20px;padding:5px 11px;transform:translate(-50%,-50%)}
.focal-schema .n1{left:50%;top:14%}.focal-schema .n2{left:85%;top:38%}.focal-schema .n3{left:72%;top:84%}
.focal-schema .n4{left:28%;top:84%}.focal-schema .n5{left:15%;top:38%}
.focal-schema::before{content:"";position:absolute;left:50%;top:50%;width:190px;height:190px;transform:translate(-50%,-50%);border:1px dashed var(--land-2);border-radius:50%}

@media (max-width:1000px){
  .msg-grid,.relais,.fiche-grid,.rub-grid,.focal{grid-template-columns:1fr}
  .fiche-grid > div + div{border-left:0!important;border-top:1px solid var(--line-soft)}
  .apercu-menu{position:static}
  .side .who{display:none}
}

/* ============================================================
   Simulateur de prêt immobilier
   ============================================================ */
.sim-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:20px;align-items:start}
.sim-resultat .versement{margin:16px 0 18px;padding:18px;background:var(--paper);border-radius:var(--r)}
.sim-resultat .versement b{display:block;font-family:var(--mono);font-size:30px;font-weight:500;letter-spacing:-.02em;color:var(--ink)}
.sim-resultat .versement span{font-size:13px;color:var(--stone)}
.resume-pret{margin:0}
.resume-pret div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line-soft);font-size:14px}
.resume-pret dt{color:var(--stone)}
.resume-pret dd{margin:0;font-family:var(--mono);font-size:13px}
.proportion{display:flex;gap:2px;height:10px;margin:18px 0 8px}
.proportion i{display:block;height:100%;border-radius:3px}
.legende{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:12px;color:var(--ink)}
.legende span{display:inline-flex;align-items:center;gap:6px}
.legende i{width:10px;height:10px;border-radius:2px;display:inline-block}
.graphe{position:relative}
.graphe svg{width:100%;height:auto;display:block}
.graphe .grille{stroke:var(--line-soft);stroke-width:1}
.graphe .base{stroke:var(--land-2);stroke-width:1}
.graphe .axe{font:400 11px var(--sans);fill:var(--stone)}
.graphe .col{cursor:default;outline:0}
.graphe .col.attenue rect:not([fill=transparent]),.graphe .col.attenue path{opacity:.35}
.infobulle{position:absolute;top:6px;transform:translateX(-50%);background:var(--white);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:0 6px 18px rgba(11,37,69,.12);padding:10px 12px;font-size:12px;pointer-events:none;min-width:170px}
.infobulle b,.infobulle span{display:flex;align-items:center;gap:6px;white-space:nowrap}
.infobulle b{margin-bottom:4px}
.infobulle i{width:9px;height:9px;border-radius:2px;display:inline-block}
.table-amort{overflow-x:auto}
.table-amort table{min-width:640px}
.table-amort th.num,.table-amort td.num{text-align:right;font-family:var(--mono);font-size:12.5px}
.table-amort thead th{position:sticky;top:0;background:var(--white)}
.table-amort tr.total td{font-weight:600;background:var(--page)}
.tabs--mini{margin:0;border:0}
.tabs--mini button{padding:6px 10px;font-size:13px}
.demande-grid{display:grid;grid-template-columns:1fr 1fr}
.etapes-demande{margin:0;padding:22px 22px 22px 46px;background:var(--paper);border-left:1px solid var(--line-soft);font-size:14px}
.etapes-demande li{margin-bottom:12px}
.etapes-demande li b{display:block}
.etapes-demande li span{color:var(--stone);font-size:13px}

/* suivi d'un dossier de crédit */
.frise{list-style:none;margin:0;padding:6px 0 0}
.frise li{position:relative;padding:0 0 16px 24px;font-size:14px}
.frise li::before{content:"";position:absolute;left:5px;top:6px;width:9px;height:9px;border-radius:50%;background:var(--verified)}
.frise li::after{content:"";position:absolute;left:9px;top:17px;bottom:0;width:1px;background:var(--line)}
.frise li:last-child::after{display:none}
.frise li.courant::before{background:var(--terracotta);box-shadow:0 0 0 4px rgba(232,115,26,.18)}
.frise li .meta{display:block}
.dossier-grid{display:grid;grid-template-columns:1fr 1fr;gap:0}
.dossier-grid > div{padding:22px}
.dossier-grid > div + div{border-left:1px solid var(--line-soft)}

@media (max-width:1000px){
  .sim-grid,.demande-grid,.dossier-grid{grid-template-columns:1fr}
  .etapes-demande{border-left:0;border-top:1px solid var(--line-soft)}
  .dossier-grid > div + div{border-left:0;border-top:1px solid var(--line-soft)}
}

/* --- nature du bien --- */
.pill--maison{background:#E6EEF7;color:#24538A}
.pill--chantier{background:#FBEBDD;color:#A34B0B}
.check.chip input{margin:0}

/* ============================================================
   Photos des biens
   ============================================================ */
.nb-photos{position:absolute;right:9px;bottom:9px;background:rgba(11,37,69,.82);color:#fff;font-size:11px;padding:4px 8px;border-radius:3px}
.galerie-principale{display:block;position:relative;width:100%;aspect-ratio:3/2;border:0;border-radius:var(--r);background:var(--land) center/cover no-repeat;cursor:zoom-in;padding:0}
.galerie-principale .tag{position:absolute;top:9px;left:9px;background:rgba(11,37,69,.88);color:#fff;font-family:var(--mono);font-size:11px;padding:4px 8px;border-radius:3px}
.galerie-vignettes{display:flex;gap:8px;overflow-x:auto;margin-top:10px;padding-bottom:4px}
.galerie-vignettes button{flex:none;width:96px;height:66px;border:0;border-radius:4px;background:var(--land) center/cover no-repeat;cursor:pointer;padding:0}
.galerie-vignettes button:hover,.galerie-vignettes button:focus-visible{box-shadow:0 0 0 2px var(--terracotta)}

.visionneuse{position:fixed;inset:0;z-index:300;background:rgba(6,18,33,.94);display:flex;align-items:center;justify-content:center}
.visionneuse figure{margin:0;max-width:min(1200px,92vw);text-align:center}
.visionneuse img{max-width:100%;max-height:82vh;display:block;margin:0 auto;border-radius:4px}
.visionneuse figcaption{color:#D6DEE5;font-size:14px;margin-top:12px}
.visionneuse button{background:rgba(255,255,255,.12);color:#fff;border:0;cursor:pointer;border-radius:50%;width:46px;height:46px;font-size:28px;line-height:1}
.visionneuse button:hover{background:rgba(255,255,255,.24)}
.vs-fermer{position:absolute;top:18px;right:18px}
.vs-nav{position:absolute;top:50%;transform:translateY(-50%)}
.vs-prec{left:18px}.vs-suiv{right:18px}

.apercus{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.apercu{position:relative}
.apercu button[data-apercu]{width:72px;height:50px;border:0;border-radius:4px;background:var(--land) center/cover no-repeat;cursor:zoom-in;padding:0}
.apercu-rejet{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:50%;border:0;background:var(--terracotta-d);color:#fff;font-size:13px;line-height:1;cursor:pointer}

.depot{display:block;border:1.5px dashed var(--land-2);border-radius:var(--r);padding:16px;text-align:center;cursor:pointer;background:var(--page)}
.depot:hover{border-color:var(--terracotta)}
.depot b{display:block;font-size:14px}
.depot span{font-size:12px;color:var(--stone)}
.depot-apercus{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.depot-apercus span{position:relative;width:84px;height:60px;border-radius:4px;background:var(--land) center/cover no-repeat}
.depot-apercus em,.photos-grille em{position:absolute;left:4px;bottom:4px;background:var(--terracotta-d);color:#fff;font-size:10px;font-style:normal;padding:2px 5px;border-radius:3px}

.gestion-photos{padding:18px 22px;background:var(--page);border-bottom:1px solid var(--line-soft)}
.photos-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}
.photos-grille figure{margin:0;background:var(--white);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.photos-grille figure.eteint{opacity:.55}
.photos-grille .ph{position:relative;display:block;width:100%;aspect-ratio:3/2;border:0;background:var(--land) center/cover no-repeat;cursor:zoom-in;padding:0}
.photos-grille figcaption{display:grid;gap:6px;padding:10px}
.photos-grille .inp{width:100%;font-size:12px}
.photos-grille figcaption .pill{justify-self:start}
.budget-saisie{display:flex;align-items:center;gap:6px;margin-top:10px;border:1px solid var(--line);border-radius:var(--r);background:var(--white);padding:0 10px}
.budget-saisie input{flex:1;min-width:0;border:0;background:none;font:500 14px var(--mono);color:var(--ink);padding:8px 0;text-align:right}
.budget-saisie input:focus{outline:0}
.budget-saisie:focus-within{border-color:var(--terracotta)}
.budget-saisie span{font-size:12px;color:var(--stone)}

/* ---------- Pages rendues par le serveur (Blade) ---------- */
.champ-erreur{display:block;font-style:normal;font-size:12px;color:var(--terracotta-d);margin-top:5px}
.field [aria-invalid=true]{border-bottom-color:var(--terracotta-d)}
.lien-side{display:block;width:100%;text-align:left;background:none;border:0;border-left:3px solid transparent;cursor:pointer;
  padding:11px 20px;font:inherit;font-size:14px;color:#D6DEE5}
.lien-side:hover{background:var(--ink-2);color:#fff}
@media (max-width:860px){.lien-side{padding:9px 8px;font-size:12px;border-left:0;width:auto}}
[x-cloak]{display:none!important}
.tcard:target{border-color:var(--terracotta);scroll-margin-top:110px}
.pin{cursor:pointer}
.pin:focus-visible path{stroke:var(--ink);stroke-width:2}
.tabs a{display:inline-block;border-bottom:2px solid transparent;padding:9px 12px;font-size:14px;color:var(--stone);margin-bottom:-1px;text-decoration:none}
.tabs a b{font-family:var(--mono);font-weight:500;font-size:12px;margin-left:4px}
.tabs a.on{color:var(--ink);border-bottom-color:var(--terracotta);font-weight:500}
a.rowbtn{display:flex;text-decoration:none;color:inherit}
.pagination{display:flex;gap:6px;flex-wrap:wrap;padding:14px 22px}
.pagination a,.pagination span{padding:5px 10px;border:1px solid var(--line);border-radius:var(--r);font-size:13px;text-decoration:none;color:var(--ink)}
.pagination .on{background:var(--ink);color:#fff;border-color:var(--ink)}
.apercu > button{width:72px;height:50px;border:0;border-radius:4px;background:var(--land) center/cover no-repeat;cursor:zoom-in;padding:0}
.apercu form{display:contents}
.rub-grid > *,.rub-ligne > form{min-width:0}
.rub-ligne .inp{min-width:0}
.rub-ligne .row{flex-wrap:wrap}
.rub-ligne .row .inp{flex:1 1 140px;width:0}
@media (max-width:1000px){
  #tGrid,#fondsGrid,#candGrid,#bienGrid,#contactGrid,#tarifsGrid,#modes,.sim-grid,.demande-grid,.dossier-grid{grid-template-columns:minmax(0,1fr)!important}
  #tGrid > *,#fondsGrid > *,#candGrid > *,#bienGrid > *,.dossier-grid > *{min-width:0}
  .panel-head{flex-wrap:wrap}
}
@media (max-width:600px){
  .rowitem{flex-wrap:wrap}
  form.row{flex-wrap:wrap}
  form.row .inp{flex:1 1 160px;width:auto!important}
}
/* Parcours d'achat : visite → offre → accord → transaction */
.parcours-achat{display:flex;gap:4px;list-style:none;margin:12px 0 14px;padding:0;counter-reset:etape}
.parcours-achat li{flex:1;font-size:11px;color:var(--stone);border-top:3px solid var(--land);padding-top:6px;counter-increment:etape}
.parcours-achat li::before{content:counter(etape) ". "}
.parcours-achat li.fait{color:var(--ink);border-top-color:var(--verified)}
@media (max-width:1000px){ #venteGrid{grid-template-columns:minmax(0,1fr)!important} #venteGrid > *{min-width:0} }
.etapes-vente{margin:0;padding-left:22px;display:grid;gap:10px;font-size:14px;color:var(--stone);max-width:90ch}
.etapes-vente b{color:var(--ink);font-weight:600}

/* --- dossier de vente : frise des 9 étapes, action attendue, onglets --- */
.frise-vente{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:6px;counter-reset:etape}
.frise-vente li{list-style:none;text-align:center;font-size:12px;color:var(--stone);position:relative;padding-top:34px}
.frise-vente li::before{content:attr(data-n);position:absolute;top:0;left:50%;transform:translateX(-50%);width:26px;height:26px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:12px;border:1px solid var(--land-2);background:var(--white)}
.frise-vente li::after{content:"";position:absolute;top:13px;left:calc(50% + 16px);right:calc(-50% + 16px);height:1px;background:var(--land-2)}
.frise-vente li:last-child::after{display:none}
.frise-vente li.fait{color:var(--ink)}
.frise-vente li.fait::before{content:"✓";background:var(--verified);border-color:var(--verified);color:#fff}
.frise-vente li.fait::after{background:var(--verified)}
.frise-vente li.cours{color:var(--ink);font-weight:600}
.frise-vente li.cours::before{background:var(--terracotta-d);border-color:var(--terracotta-d);color:#fff}
.action-vente{display:flex;gap:16px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;margin-top:18px;padding:16px 20px;
  border-radius:var(--r);background:var(--paper);border-left:3px solid var(--line)}
.action-vente.attend{border-left-color:var(--terracotta-d);background:#FBF1E8}
.action-vente h3{font-size:16px;margin:0 0 4px}
.action-vente p{margin:0;font-size:13px;color:#4A4136;max-width:72ch}
.onglets-vente{overflow-x:auto;flex-wrap:nowrap}
.onglets-vente button{white-space:nowrap}
.onglets-vente a i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--terracotta-d);margin-left:6px;vertical-align:middle}
.checklist{list-style:none;margin:0;padding:0}
.checklist li{display:flex;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line-soft);font-size:14px;flex-wrap:wrap}
.checklist li:last-child{border-bottom:0}
.checklist li .ok{color:var(--verified);font-weight:600}
.contrat-texte{font-family:Georgia,'Times New Roman',serif;font-size:15px;line-height:1.75;white-space:pre-line;color:var(--ink);
  background:var(--white);border:1px solid var(--line-soft);border-radius:var(--r);padding:22px 26px;max-height:520px;overflow:auto}
@media (max-width:860px){
  .frise-vente{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:16px}
  .frise-vente li::after{display:none}
}
.tabs a{border-bottom:2px solid transparent;padding:9px 12px;font-size:14px;color:var(--stone);margin-bottom:-1px;text-decoration:none}
.tabs a.on{color:var(--ink);border-bottom-color:var(--terracotta);font-weight:500}
