/* baildelocation.com — Générateur de bail, habillage V2
   Remplace gb.css. Ne touche pas au modèle de bail (bail-vide.html). */
:root{
  --navy:#00205B; --navy-2:#0A3A8C; --navy-50:#EEF2FA;
  --go:#047857; --go-2:#065F46; --go-50:#DDF3E8;
  --ink:#1B2533; --gray-700:#2F3B4D; --gray-500:#4A5568; --gray-300:#C3CDDD; --line:#D5DBE5; --bg:#F4F6FA;
  --warn-50:#FFF8E6; --warn:#7A5200;
  --radius:12px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:'DM Sans',system-ui,sans-serif;color:var(--ink);background:var(--bg);font-size:16px;line-height:1.5;display:flex;flex-direction:column}
a{color:var(--navy)}a:hover{color:var(--navy-2)}
:focus-visible{outline:3px solid #6C9BE8;outline-offset:2px}

/* ── En-tête ── */
.v2-topbar{background:var(--navy);color:#fff;font-size:13px;text-align:center;padding:7px 16px}
.header{background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:12px 24px;flex:none}
.v2-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--navy)}
.v2-logo{width:40px;height:40px;border-radius:10px;background:var(--navy);display:flex;align-items:center;justify-content:center;flex:none}
.header-brand{display:flex;flex-direction:column;line-height:1.2}
.v2-name{font-size:19px;font-weight:800;color:var(--navy)}
.v2-name span{color:var(--go)}
.header-brand h1{margin:2px 0 0;font-size:14px;font-weight:600;color:var(--gray-500)}
.trust-badges{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:14px;color:var(--gray-700)}
.trust-badge{display:flex;align-items:center;gap:6px}
.trust-badge svg{color:var(--go)}
.star-icon{width:16px;height:16px;fill:#B7791F}
.trust-sep{width:1px;height:18px;background:var(--line)}
.v2-account{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border:2px solid var(--navy);border-radius:8px;font-weight:700;font-size:14px;text-decoration:none;color:var(--navy)}

/* ── Mise en page ── */
.main{flex:1;min-height:0;display:flex}
.left-panel{width:50%;flex:none;overflow-y:auto;padding:24px 32px 48px;background:var(--bg)}
.left-panel > *{max-width:760px;margin-left:auto;margin-right:auto}
.right-panel{width:50%;flex:none;min-width:0;background:#E3E8F0;padding:20px;display:flex;flex-direction:column;gap:10px}
.v2-preview-head{display:flex;justify-content:space-between;align-items:center;font-size:14px;color:var(--gray-500)}
.v2-preview-head strong{color:var(--navy)}
.v2-paper{flex:1;min-height:0;background:#fff;border-radius:6px;box-shadow:0 12px 32px rgba(0,32,91,.14);overflow:hidden}
#bail-apercu{height:100%!important}

/* ── Étapes ── */
.steps-row{display:flex;gap:4px;overflow-x:auto;padding-bottom:8px;scrollbar-width:thin}
.step-btn{flex:none;border:0;background:transparent;font:inherit;font-size:13px;font-weight:600;color:var(--gray-500);padding:8px 10px;border-radius:999px;cursor:pointer;white-space:nowrap;min-height:36px}
.step-btn:hover{background:#fff;color:var(--navy)}
.step-btn.active{background:var(--navy);color:#fff}
.step-btn.completed{color:var(--go)}
.step-btn.completed::before{content:"✓ "}
.progress-track{height:6px;border-radius:999px;background:var(--line);margin:6px 0 20px;overflow:hidden}
.progress-fill{height:100%;background:var(--go);border-radius:999px;transition:width .3s}

/* ── Cartes de formulaire ── */
.form-card{display:none;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:0 6px 20px rgba(0,32,91,.05)}
.form-card.active{display:block}
.form-header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}
.form-title{margin:0;font-size:24px;font-weight:800;color:var(--navy);line-height:1.2}
.step-badge{flex:none;font-size:13px;font-weight:700;color:var(--navy);background:var(--navy-50);padding:4px 10px;border-radius:999px}
.section-title{font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--gray-500);margin:22px 0 10px}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.col-span-2{grid-column:1/-1}
.field{display:flex;flex-direction:column;gap:6px}
.field-label-row{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.field-label-row label{font-weight:700;font-size:15px;color:var(--ink)}
.sub-label{font-size:13px;color:var(--gray-500)}
.field input,.field select,.field textarea{width:100%;min-height:48px;border:1.5px solid #8A96A8;border-radius:8px;padding:10px 12px;font:inherit;font-size:16px;color:var(--ink);background:#fff}
.field textarea{min-height:96px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--navy);outline:3px solid #C9D8F4;outline-offset:0}
.field input::placeholder,.field textarea::placeholder{color:#8A96A8}
.hidden{display:none!important}
.divider{border:0;border-top:1px solid var(--line);margin:22px 0}

/* Choix */
.card-sel{border:2px solid var(--line);border-radius:10px;padding:16px;cursor:pointer;background:#fff;height:100%;transition:border-color .15s}
.card-sel:hover{border-color:var(--gray-300)}
.card-sel.selected{border-color:var(--navy);background:var(--navy-50)}
.card-sel-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.card-sel-icon{width:36px;height:36px;border-radius:8px;background:#fff;color:var(--navy);display:flex;align-items:center;justify-content:center;border:1px solid var(--line)}
.card-sel-check{width:22px;height:22px;border-radius:999px;background:var(--navy);display:flex;align-items:center;justify-content:center}
.card-sel h3{margin:0}
.card-sel-title{margin:0 0 4px;font-weight:800;color:var(--navy);font-size:16px}
.card-sel p{margin:0;font-size:14px;color:var(--gray-500)}
.seg-row{display:grid;grid-template-columns:1fr 1fr;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:4px;gap:4px}
.seg-btn{border:0;background:transparent;font:inherit;font-weight:700;color:var(--gray-500);min-height:42px;border-radius:7px;cursor:pointer}
.seg-btn.selected{background:#fff;color:var(--navy);box-shadow:0 1px 4px rgba(0,32,91,.15)}
.check-group{display:flex;flex-direction:column;gap:8px}
.check-row{display:flex;align-items:flex-start;gap:10px;font-size:15px;cursor:pointer;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#fff}
.check-row input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--navy);flex:none}
.morale-box{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:16px;margin-top:16px}
.morale-box h4{margin:0 0 10px;color:var(--navy)}
.info-box,.recall-box{border-radius:10px;padding:12px 14px;font-size:14px;margin:6px 0 14px}
.info-box{background:var(--navy-50);color:var(--gray-700)}
.recall-box{background:var(--warn-50);color:var(--warn);border:1px solid #F0D9A0}
.inline-note{font-size:13px;color:var(--gray-500)}

/* Boutons */
.btn{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 20px;border-radius:8px;font:inherit;font-weight:700;font-size:16px;cursor:pointer;border:0;text-decoration:none}
.btn-primary{background:var(--navy);color:#fff}.btn-primary:hover{background:var(--navy-2)}
.btn-ghost{background:#fff;color:var(--navy);border:2px solid var(--line)}.btn-ghost:hover{border-color:var(--navy)}
.btn-success{background:var(--go);color:#fff;min-height:56px;font-size:17px}.btn-success:hover{background:var(--go-2)}
.btn-success:disabled{opacity:.7;cursor:wait}
.btn-hidden{visibility:hidden}
.form-footer{display:flex;justify-content:space-between;gap:12px;margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}

/* Réassurance */
.trust-strip{margin-top:18px;padding:16px;border-radius:10px;background:var(--bg);display:flex;flex-direction:column;gap:8px}
.trust-item{display:flex;gap:8px;align-items:flex-start;font-size:14px;color:var(--gray-700)}
.trust-item svg{flex:none;margin-top:2px}
.final-checklist a{font-weight:700}

/* ── Fenêtre e-mail / compte (V2) ── */
.v2-modal{position:fixed;inset:0;background:rgba(0,22,64,.55);z-index:10000;display:none;align-items:center;justify-content:center;padding:16px}
.v2-modal.open{display:flex}
.v2-modal-box{background:#fff;border-radius:16px;max-width:520px;width:100%;padding:28px;box-shadow:0 20px 60px rgba(0,0,0,.25);position:relative}
.v2-modal-box h2{margin:0 0 6px;font-size:24px;color:var(--navy)}
.v2-modal-box p{margin:0 0 14px;color:var(--gray-500)}
.v2-close{position:absolute;top:12px;right:12px;width:40px;height:40px;border:0;border-radius:999px;background:var(--bg);font-size:22px;cursor:pointer;color:var(--gray-500)}
.v2-opts{display:flex;flex-direction:column;gap:8px;margin:14px 0}
.v2-err{color:#B42318;font-size:14px;margin:6px 0 0;display:none}
.v2-legal{font-size:12.5px;color:var(--gray-500);margin-top:12px}
.v2-draft{display:none;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-left:4px solid var(--navy);border-radius:10px;padding:12px 14px;margin-bottom:16px;font-size:14px}
.v2-draft.show{display:flex}
.v2-draft button{min-height:40px;font-size:14px;padding:0 14px}
.v2-mobile-preview{display:none}

/* ── Mobile ── */
@media (max-width:900px){
  body{display:block;height:auto}
  .main{display:block}
  .left-panel{width:100%;padding:16px 16px 40px;overflow:visible}
  .right-panel{display:none}
  .right-panel.v2-open{display:flex;position:fixed;inset:0;z-index:9000;padding:12px;width:auto}
  .v2-mobile-preview{display:flex;position:fixed;left:16px;bottom:16px;z-index:8000;min-height:44px;font-size:15px;box-shadow:0 6px 18px rgba(0,32,91,.3)}
  .left-panel{padding-bottom:96px}
  .trust-badges{display:none}
  .form-card{padding:18px}
  .grid-2{grid-template-columns:1fr}
  .header{padding:10px 16px}
  .v2-account{min-height:36px;padding:0 10px;font-size:13px}
}
.v2-only-mobile{display:none!important}
@media (max-width:900px){.right-panel.v2-open .v2-only-mobile{display:inline-flex!important}}

/* Menu « Mon espace » et déconnexion (entete.js) */
.me-menu{position:relative;display:inline-flex}
.me-bouton{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-family:inherit}
.me-fleche{transition:transform .15s}
.me-bouton[aria-expanded="true"] .me-fleche{transform:rotate(180deg)}
.me-liste{position:absolute;right:0;top:calc(100% + 8px);z-index:60;width:290px;background:#fff;border:1px solid #D5DBE5;border-radius:12px;box-shadow:0 14px 40px rgba(0,32,91,.18);padding:8px;display:flex;flex-direction:column;gap:2px;text-align:left}
.me-liste[hidden]{display:none}
.me-liste a{display:flex;flex-direction:column;gap:1px;padding:10px 12px;border-radius:8px;text-decoration:none;color:#1B2533}
.me-liste a strong{color:#00205B;font-size:15px}
.me-liste a span{font-size:13px;color:#4A5568;font-weight:400}
.me-liste a:hover,.me-liste a[aria-current="page"]{background:#EEF2FA}
.me-qui{margin:0 0 4px;padding:8px 12px 10px;font-size:12.5px;color:#4A5568;border-bottom:1px solid #E4E8EF;word-break:break-all}
.me-qui strong{color:#1B2533;font-size:13.5px}
.me-sortie-lien{display:flex;align-items:center;gap:8px;margin-top:4px;padding:10px 12px;border:0;border-top:1px solid #E4E8EF;background:none;font:inherit;font-size:14px;font-weight:700;color:#B42318;cursor:pointer;text-align:left}
.me-sortie-lien:hover{background:#FFF6F5}
.me-sortie{display:inline-flex;align-items:center;justify-content:center;width:42px;min-height:40px;border:1.5px solid #D5DBE5;border-radius:8px;background:#fff;color:#4A5568;cursor:pointer;padding:0}
.me-sortie:hover{border-color:#B42318;color:#B42318;background:#FFF6F5}
.espace-choix{display:inline-flex;gap:4px;padding:4px;background:#fff;border:1px solid #D5DBE5;border-radius:999px;align-self:flex-start}
.espace-choix a{padding:8px 16px;border-radius:999px;font-weight:700;font-size:14px;text-decoration:none;color:#4A5568}
.espace-choix a[aria-current="page"]{background:#00205B;color:#fff}
@media (max-width:860px){.me-liste{right:auto;left:0;width:min(290px,calc(100vw - 32px))}}

.v2-logo-img{display:block;height:33px;width:auto;flex:none}
.v2-brand{gap:14px}
@media (max-width:720px){.v2-logo-img{height:26px}}
.v2-brand .header-brand{border-left:1px solid #D5DBE5;padding-left:14px}