:root{
  --bg:#f3f5f2; --card:#fff; --ink:#1a231e; --mut:#5b665e; --line:#d8ddd7;
  --accent:#2e7a5a; --accent-2:#245f47; --amber:#b56f24; --err:#b23b2e; --ok:#2e7a5a;
  --disp:'Archivo',system-ui,sans-serif; --body:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root{--bg:#111614;--card:#191f1b;--ink:#e8ede9;--mut:#9aa89f;--line:#2b342e;--accent:#51b085;--amber:#d9944a;color-scheme:dark;}
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);line-height:1.5;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column;min-height:100%}
.wrap{width:100%;max-width:420px;margin:auto;padding:24px 18px}
.brand{display:flex;align-items:center;gap:10px;justify-content:center;margin-bottom:18px}
.logo{width:38px;height:38px;border-radius:9px;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:800;font-family:var(--disp)}
.brand b{font-family:var(--disp);font-size:17px}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px}
h1{font-family:var(--disp);font-size:21px;margin:0 0 4px;text-align:center}
.sub{color:var(--mut);font-size:13.5px;text-align:center;margin:0 0 18px}
label{display:block;font-size:12.5px;font-weight:600;margin:12px 0 5px}
input,select{width:100%;font-size:16px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink)}
input:focus,select:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}
button.primary{width:100%;margin-top:18px;padding:13px;border:0;border-radius:11px;background:var(--accent);color:#fff;font-size:15.5px;font-weight:700;font-family:var(--disp);cursor:pointer}
button.primary:disabled{opacity:.6;cursor:not-allowed}
button.primary:hover:not(:disabled){background:var(--accent-2)}
.links{margin-top:16px;text-align:center;font-size:13.5px}
.links a{color:var(--accent);text-decoration:none}
.msg{margin-top:14px;padding:11px 13px;border-radius:10px;font-size:13.5px;display:none}
.msg.show{display:block}
.msg.err{background:rgba(178,59,46,.1);color:var(--err);border:1px solid rgba(178,59,46,.3)}
.msg.ok{background:rgba(46,122,90,.1);color:var(--ok);border:1px solid rgba(46,122,90,.3)}
.hint{font-size:11.5px;color:var(--mut);margin-top:5px}
.appbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:16px}
.appbar .who{font-size:13px;color:var(--mut)}
button.ghost{background:transparent;border:1px solid var(--line);color:var(--ink);padding:8px 12px;border-radius:9px;font-size:13px;cursor:pointer}
.center-load{margin:auto;color:var(--mut);font-size:14px}

/* ============ DASHBOARD /app (Lot 2.3.a) ============ */
.icon-btn{background:transparent;border:1px solid var(--line);color:var(--ink);width:40px;height:40px;border-radius:10px;font-size:18px;cursor:pointer;display:grid;place-items:center}
.no-scroll{overflow:hidden}
.shell{display:flex;flex-direction:column;min-height:100%;width:100%}

/* Barre du haut */
.topbar{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:10px;
  padding:10px 14px;padding-top:calc(10px + env(safe-area-inset-top,0px));
  background:var(--card);border-bottom:1px solid var(--line)}
.brand-mini{display:flex;align-items:center;gap:9px;min-width:0}
.brand-mini .logo{width:32px;height:32px;border-radius:8px;font-size:15px}
.brand-name{font-family:var(--disp);font-size:15px;white-space:nowrap}
.top-right{margin-left:auto;display:flex;align-items:center;gap:12px;min-width:0}
.topbiz{display:flex;flex-direction:column;align-items:flex-end;min-width:0;line-height:1.25}
.topbiz .tb-name{font-weight:700;font-size:13.5px;max-width:46vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.topbiz .tb-trial{font-size:11px;color:var(--amber)}

/* Corps : sidebar + contenu */
.layout{display:flex;flex:1;width:100%;max-width:1180px;margin:0 auto}
.sidebar{display:none}
.side-inner{padding:16px 12px}
.content{flex:1;min-width:0;padding:18px 16px calc(84px + env(safe-area-inset-bottom,0px));outline:none}
.content .v-title{font-family:var(--disp);font-size:20px;text-align:left;margin:0 0 14px}

/* Sélecteur d'entreprise active */
.switcher{margin-bottom:14px}
.sw-label{display:block;font-size:11.5px;font-weight:600;color:var(--mut);margin:0 0 5px}
.switch-select{width:100%;font-size:14px;padding:10px}
.switch-solo{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--card);font-size:14px}
.switch-solo b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Navigation (sidebar + tiroir) */
.nav-group{margin-top:14px}
.nav-group-h{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mut);margin:0 6px 4px}
.nav-item{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:10px;color:var(--ink);text-decoration:none;font-size:14.5px}
.nav-item:hover{background:rgba(46,122,90,.08)}
.nav-item.is-active{background:var(--accent);color:#fff;font-weight:700}
.nav-item .ni-ic{width:20px;text-align:center;flex:none}
.nav-item .ni-lb{flex:1;min-width:0}
.nav-item.soon{color:var(--mut);cursor:default}
.nav-item.soon:hover{background:transparent}
.nav-item .ni-soon{font-size:10px;font-weight:700;color:var(--amber);border:1px solid var(--amber);border-radius:20px;padding:1px 7px;flex:none}

/* Panneaux de contenu */
.grid{display:grid;gap:14px;grid-template-columns:1fr}
.panel{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px}
.panel .p-h{font-family:var(--disp);font-size:14px;margin:0 0 10px}
.kv{margin:6px 0;font-size:14px}
.muted{color:var(--mut);font-size:13.5px;margin:0}
.badge-trial{display:inline-block;margin-top:10px;font-size:12.5px;font-weight:700;color:var(--amber);background:rgba(181,111,36,.12);border:1px solid rgba(181,111,36,.3);border-radius:20px;padding:4px 11px}
.empty{text-align:center;padding:30px 18px}
.empty-ic{font-size:30px;margin-bottom:8px}
.lead-sum{min-height:34px}
.lead-nums{display:flex;gap:20px}
.lead-num{display:flex;flex-direction:column}
.lead-num b{font-family:var(--disp);font-size:24px;line-height:1.1}
.lead-num span{font-size:11.5px;color:var(--mut)}
.empty-inline{display:flex;align-items:center;gap:8px}
.empty-ic-sm{font-size:20px}
.mini-link{display:inline-block;margin-top:12px;font-size:13px;color:var(--accent);text-decoration:none;font-weight:600}
.shortcuts{display:flex;flex-direction:column;gap:8px}
.shortcut{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;color:var(--ink);text-decoration:none;font-size:14px}
.shortcut:hover{background:rgba(46,122,90,.08)}
.shortcut span{width:20px;text-align:center}

/* Mes prospects (Lot 2.3.c) */
.p-filters{display:flex;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.p-search{flex:1;min-width:180px}
.p-status{width:auto;min-width:150px}
.p-list{display:flex;flex-direction:column;gap:10px}
.lead-card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px}
.lc-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.lc-name{font-weight:700;font-size:15px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lc-meta{color:var(--mut);font-size:12.5px;margin-top:4px}
.lc-actions{display:flex;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap}
.lc-stwrap{font-size:12px;color:var(--mut);display:flex;align-items:center;gap:6px}
.lc-status{width:auto;min-width:140px;font-size:13px;padding:8px 10px}
.mini-btn{background:transparent;border:1px solid var(--line);color:var(--ink);padding:8px 12px;border-radius:9px;font-size:13px;cursor:pointer}
.mini-btn:hover{background:rgba(46,122,90,.08)}
.lc-note{font-size:12px}
.lc-note.ok{color:var(--ok)}
.lc-note.err{color:var(--err)}
.lc-body{margin-top:12px;padding-top:10px;border-top:1px solid var(--line)}
.lc-body .dk{color:var(--mut);font-weight:400}
.p-more{margin-top:14px;text-align:center}
.badge{display:inline-block;font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px;border:1px solid;white-space:nowrap;flex:none}
.st-new{color:#3a9d73;border-color:#3a9d73;background:rgba(58,157,115,.14)}
.st-contact{color:#4a8fd6;border-color:#4a8fd6;background:rgba(74,143,214,.14)}
.st-quote{color:#d0913f;border-color:#d0913f;background:rgba(208,145,63,.14)}
.st-won{color:#2fae74;border-color:#2fae74;background:rgba(47,174,116,.18)}
.st-lost{color:#e0655a;border-color:#e0655a;background:rgba(224,101,90,.14)}
.st-arch{color:#9aa89f;border-color:#9aa89f;background:rgba(154,168,159,.14)}
.soon-tag{display:inline-block;font-size:12.5px;font-weight:700;color:var(--amber);background:rgba(181,111,36,.12);border:1px solid rgba(181,111,36,.3);border-radius:20px;padding:4px 12px;margin:0 0 10px}

/* Barre d'onglets basse (mobile) */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;
  background:var(--card);border-top:1px solid var(--line);
  padding-bottom:env(safe-area-inset-bottom,0px)}
.tab{flex:1;background:transparent;border:0;display:flex;flex-direction:column;align-items:center;gap:2px;
  padding:8px 4px;color:var(--mut);text-decoration:none;font-size:11px;cursor:pointer;font-family:var(--body)}
.tab .tab-ic{font-size:19px;line-height:1}
.tab.is-active{color:var(--accent);font-weight:700}

/* Tiroir mobile */
.drawer-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:40}
.drawer{position:fixed;top:0;left:0;bottom:0;z-index:50;width:min(84vw,320px);background:var(--card);
  border-right:1px solid var(--line);overflow-y:auto;overscroll-behavior:contain;
  scrollbar-width:thin;scrollbar-color:var(--line) transparent;box-shadow:2px 0 18px rgba(0,0,0,.15)}
.drawer::-webkit-scrollbar{width:8px}
.drawer::-webkit-scrollbar-thumb{background:var(--line);border-radius:8px;border:2px solid transparent;background-clip:content-box}
.drawer::-webkit-scrollbar-track{background:transparent}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:14px 14px;
  padding-top:calc(14px + env(safe-area-inset-top,0px));border-bottom:1px solid var(--line)}
.drawer-head b{font-family:var(--disp);font-size:16px}
.drawer-inner{padding:14px 12px calc(20px + env(safe-area-inset-bottom,0px))}
.logout-desktop{display:none}

/* ---- Desktop / tablette large : sidebar visible, plus de tabbar ---- */
@media (min-width:880px){
  .content{padding:26px 28px 40px}
  .sidebar{display:block;width:260px;flex:none;border-right:1px solid var(--line);
    position:sticky;top:61px;align-self:flex-start;height:calc(100vh - 61px);
    overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:transparent transparent}
  .sidebar:hover{scrollbar-color:var(--line) transparent}
  .sidebar::-webkit-scrollbar{width:8px}
  .sidebar::-webkit-scrollbar-thumb{background:transparent;border-radius:8px;border:2px solid transparent;background-clip:content-box}
  .sidebar:hover::-webkit-scrollbar-thumb{background:var(--line);background-clip:content-box}
  .sidebar::-webkit-scrollbar-track{background:transparent}
  .tabbar{display:none}
  .burger,#burger{display:none}
  .logout-desktop{display:inline-block}
  .topbiz .tb-name{max-width:220px}
  .grid{grid-template-columns:1fr 1fr}
  .content .v-title{max-width:820px}
  .panel,.empty{max-width:820px}
}

/* ---- Finitions petits écrans (≈360–400 px) : pas de scroll horizontal, rien de tronqué ---- */
@media (max-width:400px){
  .brand-name{display:none}                 /* garde le logo, libère la barre du haut */
  .content{padding-left:14px;padding-right:14px}
  .topbiz .tb-name{max-width:56vw}
  .p-search{min-width:130px}
  .p-status{min-width:128px}
  .lc-status{min-width:128px}
  .lead-num b{font-size:22px}
  .v-title{font-size:19px}
}