/* Console CRM — thème neutre, recoloré par la marque de l'opérateur (--marque, --accent). */
:root{
  --marque:#1E3A8A; --accent:#0EA5E9;
  --marque-fonce:color-mix(in srgb,var(--marque) 78%,#000);
  --marque-pale:color-mix(in srgb,var(--marque) 9%,#fff);
  --marque-voile:color-mix(in srgb,var(--marque) 16%,transparent);
  --fond:#F4F5F7; --surface:#FFFFFF; --surface2:#F9FAFB; --encre:#111827; --encre2:#4B5563; --encre3:#6B7280; --trait:#E5E7EB; --trait2:#D1D5DB;
  --vert:#047857; --vert-fond:#D1FAE5; --ambre:#B45309; --ambre-fond:#FEF3C7; --rouge:#B91C1C; --rouge-fond:#FEE2E2; --bleu:#1D4ED8; --bleu-fond:#DBEAFE; --gris-fond:#F3F4F6;
  --rayon:12px; --ombre:0 1px 2px rgba(17,24,39,.05),0 4px 16px rgba(17,24,39,.06);
  --police:"Inter",ui-sans-serif,-apple-system,"Segoe UI",Roboto,system-ui,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--police);font-size:15px;color:var(--encre);background:var(--fond);line-height:1.45;overflow-x:hidden}
a{color:var(--marque)}
h1,h2,h3,h4{margin:0;line-height:1.2;letter-spacing:-.01em}
h1{font-size:1.45rem;font-weight:750} h2{font-size:1.1rem;font-weight:700} h3{font-size:.95rem;font-weight:700}
p{margin:0 0 .7rem}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
[hidden]{display:none!important}
.muet{color:var(--encre3)} .petit{font-size:.85rem} .mono{font-family:var(--mono);font-size:.88em}
.nowrap{white-space:nowrap}

/* ───── Boutons ───── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;padding:.55rem .95rem;border-radius:9px;font-weight:650;font-size:.9rem;line-height:1.1;border:1px solid transparent;cursor:pointer;background:var(--marque);color:#fff;text-decoration:none;white-space:nowrap;transition:background .15s,border-color .15s,box-shadow .15s}
.btn:hover{background:var(--marque-fonce)}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.btn.sec{background:var(--surface);border-color:var(--trait2);color:var(--encre)}
.btn.sec:hover{border-color:var(--marque);color:var(--marque);background:var(--surface)}
.btn.fantome{background:transparent;color:var(--encre2)} .btn.fantome:hover{background:var(--gris-fond);color:var(--encre)}
.btn.danger{background:var(--surface);border-color:#FCA5A5;color:var(--rouge)} .btn.danger:hover{background:var(--rouge-fond)}
.btn.mini{padding:.35rem .65rem;font-size:.82rem;border-radius:7px}
.btn.bloc{width:100%}
.btn svg{width:1rem;height:1rem;flex:none}
.lien{background:none;border:0;padding:0;color:var(--marque);font-weight:600;cursor:pointer}
.lien:hover{text-decoration:underline}

/* ───── Champs ───── */
.champ{display:grid;gap:.3rem;font-weight:600;font-size:.85rem;color:var(--encre2);min-width:0}
.champ small{font-weight:400;color:var(--encre3)}
.champ input,.champ select,.champ textarea,.saisie{font-weight:400;font-size:.95rem;color:var(--encre);padding:.55rem .7rem;border:1px solid var(--trait2);border-radius:9px;background:var(--surface);width:100%;min-width:0;transition:border-color .15s,box-shadow .15s}
.champ textarea{resize:vertical;min-height:5rem}
.champ input:focus,.champ select:focus,.champ textarea:focus,.saisie:focus{outline:none;border-color:var(--marque);box-shadow:0 0 0 3px var(--marque-voile)}
.champ input[type=color]{padding:.15rem;height:2.4rem;cursor:pointer}
.grille{display:grid;gap:.9rem}
@media(min-width:700px){.grille.deux{grid-template-columns:1fr 1fr}.grille.trois{grid-template-columns:repeat(3,1fr)}.grille .large{grid-column:1/-1}}
.case{display:flex;gap:.55rem;align-items:flex-start;font-size:.9rem;cursor:pointer;font-weight:500;color:var(--encre)}
.case input{width:1.05rem;height:1.05rem;margin-top:.12rem;accent-color:var(--marque);flex:none}
/* Interrupteur */
.inter{position:relative;display:inline-flex;align-items:center;gap:.6rem;cursor:pointer;font-weight:500;font-size:.9rem;color:var(--encre)}
.inter input{position:absolute;opacity:0;pointer-events:none}
.inter i{width:2.3rem;height:1.3rem;border-radius:999px;background:var(--trait2);position:relative;transition:background .18s;flex:none}
.inter i::after{content:"";position:absolute;top:.15rem;left:.15rem;width:1rem;height:1rem;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.25);transition:transform .18s}
.inter input:checked+i{background:var(--marque)}
.inter input:checked+i::after{transform:translateX(1rem)}
.inter input:focus-visible+i{outline:2px solid var(--accent);outline-offset:2px}
.inter input:disabled+i{opacity:.45}

/* ───── Structure ───── */
.app{display:grid;min-height:100vh;min-height:100dvh}
@media(min-width:1000px){.app{grid-template-columns:15.5rem 1fr}}
.cote{background:var(--marque-fonce);color:#fff;display:flex;flex-direction:column;padding:1rem .75rem;position:sticky;top:0;height:100vh;height:100dvh;overflow-y:auto}
.cote .tete{display:flex;align-items:center;gap:.6rem;padding:.3rem .5rem 1.1rem}
.cote .tete img{max-height:2rem;max-width:7rem;object-fit:contain;background:#fff;border-radius:6px;padding:2px 4px}
.cote .tete img.icone-produit{width:2.1rem;height:2.1rem;padding:0;background:none;border-radius:9px;box-shadow:0 0 0 1px rgba(255,255,255,.18)}
.porte .logo-p img.logo-produit{max-height:3.4rem;max-width:15rem}
.porte .logo-p img.carre{padding:0;background:none}
.marque-nom{font-weight:800;font-size:1.15rem;letter-spacing:-.02em}
.marque-op{font-size:.75rem;opacity:.7;display:block;font-weight:500;letter-spacing:0}
.nav{display:grid;gap:.15rem}
.nav .groupe{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;opacity:.55;padding:.9rem .7rem .3rem;font-weight:700}
.nav a{display:flex;align-items:center;gap:.65rem;padding:.55rem .7rem;border-radius:8px;color:rgba(255,255,255,.82);text-decoration:none;font-weight:550;font-size:.92rem}
.nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.nav a[aria-current=page]{background:rgba(255,255,255,.14);color:#fff}
.nav a svg{width:1.1rem;height:1.1rem;flex:none;opacity:.9}
.nav a.bientot{opacity:.45;cursor:default} .nav a.bientot:hover{background:none}
.nav a .tag{margin-left:auto;font-size:.65rem;font-weight:700;background:rgba(255,255,255,.12);padding:.08rem .4rem;border-radius:999px}
.cote .pied{margin-top:auto;padding:.8rem .5rem 0;border-top:1px solid rgba(255,255,255,.12);display:grid;gap:.4rem}
.cote .moi{display:flex;align-items:center;gap:.6rem;font-size:.85rem}
.cote .moi b{display:block;font-weight:650} .cote .moi span{opacity:.65;font-size:.78rem}
.avatar{width:2rem;height:2rem;border-radius:50%;display:grid;place-items:center;font-weight:750;font-size:.78rem;background:var(--accent);color:#fff;flex:none;text-transform:uppercase}
.avatar.gris{background:var(--trait2);color:var(--encre2)}
.cote .pied button{background:none;border:0;color:rgba(255,255,255,.7);text-align:left;padding:.3rem 0;cursor:pointer;font-size:.85rem}
.cote .pied button:hover{color:#fff}
.haut-mobile{display:none}
@media(max-width:999px){
  .cote{position:fixed;inset:0 auto 0 0;width:17rem;z-index:60;transform:translateX(-100%);transition:transform .22s ease;box-shadow:0 0 40px rgba(0,0,0,.3)}
  .cote.ouvert{transform:none}
  .voile-nav{position:fixed;inset:0;background:rgba(17,24,39,.4);z-index:55}
  .haut-mobile{display:flex;align-items:center;gap:.7rem;position:sticky;top:0;z-index:40;background:var(--marque-fonce);color:#fff;padding:.65rem 1rem;padding-top:max(.65rem,env(safe-area-inset-top))}
  .haut-mobile button{background:none;border:0;color:#fff;padding:.3rem;display:grid;cursor:pointer}
  .haut-mobile svg{width:1.4rem;height:1.4rem}
}
.principal{min-width:0;padding:1.5rem clamp(1rem,3vw,2.2rem) 4rem}
.entete{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8rem;margin-bottom:1.2rem}
.entete .sous{color:var(--encre3);font-size:.9rem;margin-top:.2rem}
.actions{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}

/* ───── Cartes, tableaux ───── */
.carte{background:var(--surface);border:1px solid var(--trait);border-radius:var(--rayon);padding:1.1rem 1.2rem;box-shadow:var(--ombre);min-width:0}
.carte>h2,.carte>h3{margin-bottom:.8rem}
.carte .titre-l{display:flex;justify-content:space-between;align-items:center;gap:.6rem;margin-bottom:.8rem}
.cartes{display:grid;gap:1rem}
@media(min-width:800px){.cartes.deux{grid-template-columns:1fr 1fr}.cartes.trois{grid-template-columns:repeat(3,1fr)}}
.kpis{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));margin-bottom:1rem}
.kpi{background:var(--surface);border:1px solid var(--trait);border-radius:var(--rayon);padding:.9rem 1rem;box-shadow:var(--ombre);text-decoration:none;color:inherit;display:block}
.kpi:hover{border-color:var(--marque)}
.kpi b{display:block;font-size:1.7rem;font-weight:800;letter-spacing:-.02em;color:var(--encre)}
.kpi span{font-size:.82rem;color:var(--encre3);font-weight:550}
.kpi.alerte b{color:var(--ambre)}
.table-l{width:100%;border-collapse:collapse;font-size:.9rem}
.table-l th{text-align:left;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--encre3);font-weight:700;padding:.55rem .7rem;border-bottom:1px solid var(--trait);background:var(--surface2);white-space:nowrap}
.table-l td{padding:.65rem .7rem;border-bottom:1px solid var(--trait);vertical-align:middle}
.table-l tbody tr{cursor:pointer;transition:background .1s}
.table-l tbody tr:hover{background:var(--marque-pale)}
.table-l td.num{text-align:right;font-variant-numeric:tabular-nums}
.table-l .principal-c b{display:block;font-weight:650} .table-l .principal-c span{font-size:.8rem;color:var(--encre3)}
.cadre-table{background:var(--surface);border:1px solid var(--trait);border-radius:var(--rayon);box-shadow:var(--ombre);overflow:hidden}
.cadre-table .defile,.carte .defile,.principal .defile{overflow-x:auto;max-width:100%}
.vide{text-align:center;padding:2.5rem 1rem;color:var(--encre3)}
.vide b{display:block;color:var(--encre);font-size:1rem;margin-bottom:.3rem}
@media(max-width:699px){
  .table-l.empile thead{display:none}
  .table-l.empile tr{display:grid;grid-template-columns:1fr auto;gap:.15rem .6rem;padding:.75rem .9rem;border-bottom:1px solid var(--trait)}
  .table-l.empile td{border:0;padding:0}
  .table-l.empile td.cacher-m{display:none}
  .table-l.empile td.principal-c{grid-column:1}
  .table-l.empile td:nth-child(2){grid-column:2;grid-row:1;text-align:right}
  .table-l.empile td.ligne-m{grid-column:1/-1;font-size:.82rem;color:var(--encre3)}
}

/* ───── Filtres ───── */
.filtres{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin-bottom:1rem}
.recherche{position:relative;flex:1 1 15rem;max-width:26rem}
.recherche svg{position:absolute;left:.7rem;top:50%;transform:translateY(-50%);width:1rem;height:1rem;color:var(--encre3)}
.recherche input{padding-left:2.1rem}
.onglets{display:inline-flex;background:var(--gris-fond);border-radius:10px;padding:.2rem;gap:.15rem;flex-wrap:wrap}
.onglets button{border:0;background:none;padding:.4rem .75rem;border-radius:8px;font-weight:600;font-size:.85rem;color:var(--encre2);cursor:pointer}
.onglets button[aria-pressed=true]{background:var(--surface);color:var(--encre);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.onglets button .n{font-size:.75rem;color:var(--encre3);margin-left:.25rem}
select.saisie{width:auto;padding-right:2rem}

/* ───── Pastilles ───── */
.pastille{display:inline-flex;align-items:center;gap:.3rem;padding:.15rem .55rem;border-radius:999px;font-size:.75rem;font-weight:700;white-space:nowrap;background:var(--gris-fond);color:var(--encre2)}
.p-client,.p-actif,.p-gagne{background:var(--vert-fond);color:var(--vert)}
.p-prospect,.p-commande,.p-proposition,.p-rdv{background:var(--bleu-fond);color:var(--bleu)}
.p-portabilite,.p-negociation,.p-contacte,.p-attente{background:var(--ambre-fond);color:var(--ambre)}
.p-ancien,.p-resilie,.p-perdu,.p-inactif{background:var(--rouge-fond);color:var(--rouge)}
.p-admin{background:var(--marque-pale);color:var(--marque)}
.etiquette{display:inline-block;font-size:.72rem;font-weight:600;padding:.08rem .45rem;border-radius:6px;background:var(--gris-fond);color:var(--encre2);margin:.1rem .2rem .1rem 0}

/* ───── Pipeline ───── */
.pipeline{display:grid;gap:.45rem}
.pipeline .etape{display:grid;grid-template-columns:7rem 1fr 2rem;gap:.6rem;align-items:center;font-size:.85rem}
.pipeline .barre{height:.6rem;border-radius:999px;background:var(--gris-fond);overflow:hidden}
.pipeline .barre i{display:block;height:100%;background:var(--marque);border-radius:999px;transition:width .5s}
.pipeline .etape b{text-align:right;font-variant-numeric:tabular-nums}
.liste-l{display:grid}
.liste-l a,.liste-l .el{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.55rem 0;border-bottom:1px solid var(--trait);text-decoration:none;color:inherit;font-size:.9rem}
.liste-l a:last-child{border-bottom:0}
.liste-l a:hover b{color:var(--marque)}

/* ───── Fiche ───── */
.fiche-tete{display:flex;gap:1rem;align-items:flex-start;flex-wrap:wrap;margin-bottom:1rem}
.fiche-tete .ident{flex:1;min-width:14rem}
.fiche-tete .ident h1{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.fiche-tete .meta{display:flex;flex-wrap:wrap;gap:.3rem 1rem;color:var(--encre3);font-size:.88rem;margin-top:.35rem}
.retour{display:inline-flex;align-items:center;gap:.3rem;color:var(--encre3);text-decoration:none;font-size:.88rem;margin-bottom:.6rem}
.retour:hover{color:var(--marque)}
.retour svg{width:1rem;height:1rem;flex:none}
.tabs{display:flex;gap:.2rem;border-bottom:1px solid var(--trait);margin-bottom:1.1rem;overflow-x:auto;scrollbar-width:none}
.tabs button{border:0;background:none;padding:.65rem .9rem;font-weight:650;font-size:.9rem;color:var(--encre3);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.tabs button[aria-selected=true]{color:var(--marque);border-bottom-color:var(--marque)}
.tabs button .n{font-size:.75rem;background:var(--gris-fond);border-radius:999px;padding:.05rem .45rem;margin-left:.3rem;color:var(--encre2)}
.fil{display:grid;gap:.7rem}
.fil .ev{display:grid;grid-template-columns:2rem 1fr;gap:.7rem}
.fil .ev .ic{width:2rem;height:2rem;border-radius:50%;display:grid;place-items:center;background:var(--marque-pale);color:var(--marque)}
.fil .ev .ic svg{width:.95rem;height:.95rem}
.fil .ev .bulle{background:var(--surface2);border:1px solid var(--trait);border-radius:10px;padding:.6rem .8rem;font-size:.9rem;white-space:pre-wrap;word-break:break-word}
.fil .ev small{display:block;color:var(--encre3);font-size:.78rem;margin-bottom:.25rem}
.contact-c{display:flex;gap:.8rem;align-items:flex-start;padding:.8rem 0;border-bottom:1px solid var(--trait)}
.contact-c:last-child{border-bottom:0}
.contact-c .infos{flex:1;min-width:0;font-size:.88rem}
.contact-c .infos b{font-size:.95rem}
.contact-c .infos div{color:var(--encre2);overflow-wrap:anywhere}
.dl{display:grid;grid-template-columns:auto 1fr;gap:.45rem 1rem;font-size:.9rem}
.dl dt{color:var(--encre3)} .dl dd{margin:0;overflow-wrap:anywhere}

/* ───── Matrice de droits ───── */
.matrice{display:grid;gap:.6rem}
.module{border:1px solid var(--trait);border-radius:10px;padding:.75rem .9rem;background:var(--surface)}
.module .mtete{display:flex;justify-content:space-between;align-items:center;gap:.6rem;margin-bottom:.5rem}
.module .mtete b{font-size:.92rem}
.module .acts{display:flex;flex-wrap:wrap;gap:.45rem .9rem}
.module .lot{font-size:.7rem;font-weight:700;color:var(--ambre);background:var(--ambre-fond);border-radius:999px;padding:.05rem .45rem;margin-left:.4rem}
.puce-droit{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .6rem;border-radius:7px;border:1px solid var(--trait2);font-size:.82rem;cursor:pointer;user-select:none;font-weight:550}
.puce-droit input{accent-color:var(--marque)}
.puce-droit:has(input:checked){border-color:var(--marque);background:var(--marque-pale);color:var(--marque)}
.profils-l{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr))}
.profil-c{text-align:left;cursor:pointer;font:inherit;color:inherit;display:grid;gap:.4rem}
.profil-c:hover{border-color:var(--marque)}
.profil-c .compte{font-size:.8rem;color:var(--encre3)}
.jauge{height:.35rem;border-radius:999px;background:var(--gris-fond);overflow:hidden}
.jauge i{display:block;height:100%;background:var(--accent)}
.choix-clients{max-height:15rem;overflow-y:auto;border:1px solid var(--trait2);border-radius:9px;padding:.4rem .6rem;display:grid;gap:.15rem}
.lien-copie{display:flex;gap:.5rem;align-items:center;background:var(--gris-fond);border-radius:9px;padding:.55rem .7rem;font-family:var(--mono);font-size:.78rem;word-break:break-all}

/* ───── Tiroir et modale ───── */
.voile{position:fixed;inset:0;background:rgba(17,24,39,.45);z-index:80;display:flex;justify-content:flex-end;animation:fondu .15s}
.tiroir{background:var(--surface);width:min(36rem,100%);height:100%;overflow-y:auto;display:flex;flex-direction:column;animation:glisse .22s cubic-bezier(.2,.8,.2,1)}
.tiroir .t-tete{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:1rem 1.2rem;border-bottom:1px solid var(--trait);position:sticky;top:0;background:var(--surface);z-index:2}
.tiroir .t-corps{padding:1.2rem;display:grid;gap:1rem;flex:1}
.tiroir .t-pied{display:flex;justify-content:flex-end;gap:.5rem;padding:.9rem 1.2rem;border-top:1px solid var(--trait);position:sticky;bottom:0;background:var(--surface);padding-bottom:max(.9rem,env(safe-area-inset-bottom))}
.tiroir .t-pied .gauche{margin-right:auto}
.fermer{background:none;border:0;cursor:pointer;color:var(--encre3);padding:.3rem;border-radius:6px;display:grid}
.fermer:hover{background:var(--gris-fond);color:var(--encre)}
.fermer svg{width:1.2rem;height:1.2rem}
.section-t{font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--encre3);font-weight:750;margin:.3rem 0 -.3rem}
details.plier{border:1px solid var(--trait);border-radius:10px;padding:.7rem .9rem}
details.plier summary{cursor:pointer;font-weight:650;font-size:.9rem}
details.plier[open] summary{margin-bottom:.8rem}
@keyframes fondu{from{opacity:0}}
@keyframes glisse{from{transform:translateX(30px);opacity:.4}}

/* ───── Porte (connexion) ───── */
.porte{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:1.5rem;background:radial-gradient(1200px 600px at 10% -10%,var(--marque-voile),transparent),var(--fond)}
.porte .boite{width:min(25rem,100%);background:var(--surface);border:1px solid var(--trait);border-radius:16px;padding:2rem 1.7rem;box-shadow:0 20px 60px rgba(17,24,39,.08)}
.porte .logo-p{display:flex;align-items:center;gap:.6rem;margin-bottom:1.4rem}
.porte .logo-p img{max-height:2.4rem;max-width:9rem;object-fit:contain}
.porte .logo-p .carre{width:2.4rem;height:2.4rem;border-radius:10px;background:var(--marque);color:#fff;display:grid;place-items:center;font-weight:800;font-size:1.1rem}
.porte h1{font-size:1.3rem;margin-bottom:.3rem}
.porte form{display:grid;gap:.9rem;margin-top:1.2rem}
.erreur{color:var(--rouge);background:var(--rouge-fond);border-radius:8px;padding:.5rem .7rem;font-size:.88rem;margin:0}
.info{background:var(--bleu-fond);color:#1E3A8A;border-radius:9px;padding:.65rem .8rem;font-size:.88rem}
.info.ambre{background:var(--ambre-fond);color:#78350F}
.signature-p{margin-top:1.4rem;font-size:.75rem;color:var(--encre3);text-align:center}

/* Toast */
.toast{position:fixed;left:50%;bottom:1.4rem;transform:translate(-50%,160%);background:#111827;color:#fff;padding:.75rem 1.1rem;border-radius:10px;box-shadow:0 12px 32px rgba(0,0,0,.25);z-index:100;max-width:calc(100vw - 2rem);font-size:.9rem;transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.toast.on{transform:translate(-50%,0)}
.toast.err{background:var(--rouge)}
.apercu-marque{border:1px solid var(--trait);border-radius:10px;overflow:hidden;display:grid;grid-template-columns:5rem 1fr;min-height:7rem}
.apercu-marque .ac{background:var(--marque-fonce);padding:.6rem;display:grid;gap:.35rem;align-content:start}
.apercu-marque .ac i{display:block;height:.45rem;border-radius:4px;background:rgba(255,255,255,.25)}
.apercu-marque .ac i:first-child{background:rgba(255,255,255,.7);width:70%}
.apercu-marque .ap{padding:.8rem;display:grid;gap:.5rem;align-content:start;background:var(--fond)}
.apercu-marque .ap .b{justify-self:start;background:var(--marque);color:#fff;font-size:.72rem;font-weight:700;padding:.3rem .6rem;border-radius:6px}
.apercu-marque .ap .a{justify-self:start;background:var(--accent);width:2rem;height:.45rem;border-radius:4px}

/* ───── Lot 3 : devis ───── */
.info.vert{background:var(--vert-fond);color:#065F46}
.ambre-t{color:var(--ambre);display:block}
.section-g{margin:1.6rem 0 .8rem}
.grille-devis{display:grid;gap:1rem;grid-template-columns:minmax(0,1fr);align-items:start;margin-bottom:1rem}
@media (min-width:1100px){.grille-devis{grid-template-columns:minmax(0,1fr) 22rem}}
.col-p,.col-s{display:grid;gap:1rem;min-width:0}
.t-devis tr.chap td,.pub-t tr.chap td{background:var(--marque-pale);font-weight:800;color:var(--marque);text-transform:uppercase;font-size:.76rem;letter-spacing:.05em}
.t-devis tbody tr,.pub-t tbody tr{cursor:default} .t-devis tbody tr:hover,.pub-t tbody tr:hover{background:none}
.t-devis tr.sous-t td{text-align:right;font-weight:700;font-size:.82rem;color:var(--marque);border-bottom:0}
.recap{margin:.2rem 0 0;padding-left:1.1rem;font-size:.88rem;color:var(--encre2)} .recap li{margin:.15rem 0}
.marges{display:grid;gap:.7rem;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));margin-top:1rem}
.marge{border:1px solid var(--trait);border-radius:10px;padding:.7rem .85rem;display:grid;gap:.15rem;background:var(--surface2)}
.marge b{font-size:1.25rem;font-weight:800}
.marge>span:not(.muet){font-size:.82rem;color:var(--encre2)}
.marge.sous{border-color:#FCD34D;background:var(--ambre-fond)} .marge.sous b{color:var(--ambre)}
.bandeau-v{display:flex;gap:.8rem;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:1rem}
.carte-ok{border-color:#6EE7B7;background:linear-gradient(var(--vert-fond),var(--surface) 4rem)}
.ligne-v{display:flex;justify-content:space-between;gap:.6rem;align-items:center;padding:.55rem 0;border-bottom:1px solid var(--trait)}
.histo{list-style:none;margin:0;padding:0;display:grid;gap:.55rem;font-size:.88rem;max-height:24rem;overflow:auto}
.histo li{display:grid;gap:.1rem;border-left:2px solid var(--marque-voile);padding-left:.6rem}
.barres{display:grid;gap:.6rem}
.barres div{display:grid;grid-template-columns:6.5rem 1fr auto;gap:.6rem;align-items:center;font-size:.88rem}
.barres i{display:block;height:1.1rem;border-radius:5px;background:var(--marque);min-width:3px} .barres i.avant{background:#9CA3AF}
.barres b{white-space:nowrap}
.cherche-client{position:relative}
.propositions{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 4px);background:var(--surface);border:1px solid var(--trait2);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.14);display:grid;max-height:18rem;overflow:auto}
.propositions button{display:grid;text-align:left;background:none;border:0;padding:.55rem .75rem;cursor:pointer;border-bottom:1px solid var(--trait)}
.propositions button:hover,.propositions button:focus{background:var(--marque-pale)}
.liste-choix{display:grid;gap:.5rem}
.choix{display:flex;gap:.7rem;align-items:flex-start;text-align:left;border:1px solid var(--trait2);border-radius:10px;padding:.7rem .8rem;background:var(--surface);cursor:pointer;width:100%}
.choix:hover{border-color:var(--marque)} .choix>span{display:grid;gap:.1rem}
.choix:has(input:checked){border-color:var(--marque);background:var(--marque-pale)}
.ligne-ia{display:flex;justify-content:space-between;gap:.6rem;padding:.45rem 0;border-bottom:1px solid var(--trait);align-items:center}
.ligne-ia>span:first-child{display:grid}
.grille-ent{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr))}
.grille-ent .large{grid-column:1/-1}
@media (min-width:900px){.grille-ent{grid-template-columns:repeat(4,minmax(0,1fr))}.grille-ent .champ:nth-child(1){grid-column:span 2}}
.chap-ed{margin-bottom:1rem;padding:.8rem .8rem .9rem}
.chap-t{display:flex;gap:.6rem;align-items:center;margin-bottom:.6rem;flex-wrap:wrap}
.chap-nom{font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--marque);font-size:.9rem;flex:1 1 12rem;min-width:8rem}
.chap-t .st{font-weight:600}
.t-ed th{padding:.45rem .4rem} .t-ed td{padding:.35rem .3rem;vertical-align:top}
.t-ed tbody tr{cursor:default} .t-ed tbody tr:hover{background:none}
.t-ed .c-des{min-width:15rem;width:40%}
.t-ed td.num{padding-top:.75rem}
.cel{width:100%;border:1px solid transparent;border-radius:7px;padding:.42rem .5rem;background:transparent;font-size:.9rem;min-width:0}
.cel:hover{border-color:var(--trait2)} .cel:focus{outline:none;border-color:var(--marque);background:var(--surface);box-shadow:0 0 0 3px var(--marque-voile)}
.cel.n{text-align:right;width:5.6rem}
.cel.lib{font-weight:600}
select.cel{width:auto;border-color:var(--trait);background:var(--surface)}
textarea.cel.desc{resize:vertical;font-size:.82rem;color:var(--encre2);margin-top:.2rem;min-height:2rem;display:block}
.t-ed .outils,.chap-t .outils{white-space:nowrap}
.outils button{border:0;background:none;color:var(--encre3);cursor:pointer;width:1.7rem;height:1.9rem;border-radius:6px;font-size:.95rem}
.outils button:hover:not([disabled]){background:var(--gris-fond);color:var(--encre)} .outils button[disabled]{opacity:.3;cursor:default}
.outils button[data-a=sup]:hover,.outils button[data-ca=sup]:hover{color:var(--rouge);background:var(--rouge-fond)}
.t-promo{background:color-mix(in srgb,var(--vert-fond) 45%,transparent)}
.t-promo .pastille{margin:.2rem 0 .1rem .5rem}
.t-texte .cel{font-style:italic;color:var(--encre2)}
.a-chiffrer td:first-child{box-shadow:inset 3px 0 0 var(--ambre)}
.a-chiffrer [data-k=pu]{border-color:#FCD34D;background:var(--ambre-fond)}
.mini-l{display:flex;gap:.25rem;align-items:center;font-size:.72rem;color:var(--encre3)} .mini-l .cel.n{width:3.4rem}
td.coef{white-space:nowrap;font-size:.82rem;color:var(--vert);font-weight:700} td.coef.bas{color:var(--ambre)}
.ajout{margin-top:.6rem}
.barre-ed{position:sticky;bottom:0;z-index:20;display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;margin:1rem -.2rem 0;padding:.7rem .9rem;background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(6px);border:1px solid var(--trait);border-radius:12px;box-shadow:0 -4px 18px rgba(17,24,39,.08)}
.barre-ed .espace{flex:1}
.etat{font-size:.82rem;color:var(--vert);font-weight:650} .etat.sale{color:var(--ambre)}
.liste-art{display:grid;gap:.4rem}
.art{display:grid;grid-template-columns:2.6rem 1fr auto auto;gap:.7rem;align-items:center;text-align:left;border:1px solid var(--trait);border-radius:10px;padding:.45rem .6rem;background:var(--surface);cursor:pointer;transition:background .2s,border-color .2s}
.art:hover{border-color:var(--marque)} .art.ajoute{background:var(--vert-fond);border-color:#6EE7B7}
.art img,.art .vignette{width:2.6rem;height:2.6rem;object-fit:contain;border-radius:7px;background:var(--surface2);display:grid;place-items:center;color:var(--encre3)}
.art .vignette svg{width:1.2rem;height:1.2rem} .art .t{display:grid;min-width:0} .art .p{font-weight:700;white-space:nowrap}
.art .plus svg{width:1.1rem;height:1.1rem;color:var(--marque)}
.modele-c{display:grid;gap:.35rem;align-content:start}
.barre-masse{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;background:var(--marque-pale);border:1px solid var(--marque-voile);border-radius:10px;padding:.55rem .7rem;margin-bottom:.8rem}
.barre-masse .saisie{width:auto;padding:.4rem .55rem;font-size:.85rem}
.table-l .sel{width:2.2rem}
.art-l{display:flex;gap:.6rem;align-items:center} .art-l img{width:2.2rem;height:2.2rem;object-fit:contain;border-radius:6px;background:var(--surface2);flex:none} .art-l>span{display:grid}
.vignette-g{max-height:4.5rem;max-width:7rem;object-fit:contain;border:1px solid var(--trait);border-radius:8px;padding:3px;background:#fff}
.couleur-l{display:flex;gap:.5rem} .couleur-l input[type=color]{width:3.2rem;flex:none}
.hex{font-family:var(--mono);text-transform:uppercase} .hex.ko{border-color:var(--rouge)!important}

/* ───── Page publique de signature ───── */
body.public{background:var(--fond)}
.pub-tete{display:flex;justify-content:center;padding:1.4rem 1rem .4rem} .pub-tete img{max-height:3.2rem;max-width:14rem} .pub-tete b{font-size:1.3rem;color:var(--marque)}
.pub{max-width:52rem;margin:0 auto;padding:1rem 16px 3rem;display:grid;gap:1rem}
.pub h1{font-size:1.35rem;margin:.2rem 0}
.pad{position:relative;margin-top:.4rem;border:2px dashed var(--trait2);border-radius:12px;background:#fff;touch-action:none}
.pad canvas{display:block;width:100%;height:auto;aspect-ratio:3/1;cursor:crosshair;touch-action:none}
.pad-aide{position:absolute;inset:0;display:grid;place-items:center;color:var(--encre3);pointer-events:none;font-size:.95rem}
.succes{text-align:center;display:grid;gap:.5rem;justify-items:center;padding:1rem 0}
.coche{width:3.4rem;height:3.4rem;border-radius:50%;display:grid;place-items:center;background:var(--vert-fond);color:var(--vert);font-size:1.7rem;font-weight:800}
@media (max-width:640px){.barre-ed{margin:1rem 0 0}.barre-ed .btn{flex:1 1 auto}.barres div{grid-template-columns:5rem 1fr}.barres b{grid-column:2}}
.mobile-seul{display:none}
@media (max-width:640px){.mobile-seul{display:flex}.barre-ed #b-pdf,.barre-ed #b-sup,.barre-ed #b-sig{display:none}.barre-ed{padding:.5rem .6rem;gap:.4rem}.barre-ed .btn{flex:0 1 auto}.barre-ed #b-enr{flex:1 1 auto}}
/* Glisser-déposer dans l'éditeur de devis */
.c-p{width:1.6rem;padding-left:0!important;padding-right:0!important}
.poignee{display:inline-grid;place-items:center;width:1.5rem;height:2rem;color:var(--encre3);cursor:grab;touch-action:none;user-select:none;border-radius:6px;font-size:1rem;line-height:1}
.poignee:hover{background:var(--gris-fond);color:var(--marque)}
.chap-t .poignee{height:2.2rem}
body.en-glisse,body.en-glisse *{cursor:grabbing!important;user-select:none}
.glisse{opacity:.35}
.fantome-dd{position:fixed;z-index:200;pointer-events:none;background:var(--surface);border:1px solid var(--marque);border-radius:10px;padding:.55rem .8rem;font-weight:650;font-size:.9rem;box-shadow:0 12px 32px rgba(17,24,39,.22);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transform:rotate(-1deg)}
tr.dd-avant td{box-shadow:inset 0 3px 0 var(--marque)} tr.dd-apres td{box-shadow:inset 0 -3px 0 var(--marque)}
.chap-ed.dd-dans{outline:2px dashed var(--marque);outline-offset:3px}
.chap-ed.dd-avant{box-shadow:0 -4px 0 var(--marque)} .chap-ed.dd-apres{box-shadow:0 4px 0 var(--marque)}
.encart-o{border-left:4px solid var(--marque)} .encart-o p{margin:.3rem 0 0;white-space:normal}
.verrou{display:flex;gap:.8rem;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:1rem}

/* ───── Lots 4-5 : notifications, tâches, tickets ───── */
.cloche{position:relative;margin-left:auto;background:none;border:0;color:inherit;cursor:pointer;display:grid;place-items:center;width:2.2rem;height:2.2rem;border-radius:8px;flex:none}
.cote .cloche{color:#fff} .cote .cloche:hover{background:rgba(255,255,255,.12)}
.cloche svg{width:1.25rem;height:1.25rem}
.cloche .n{position:absolute;top:1px;right:0;min-width:1.05rem;height:1.05rem;padding:0 .25rem;border-radius:999px;background:#F59E0B;color:#111;font-size:.66rem;font-weight:800;display:grid;place-items:center;line-height:1}
.compte-nav{margin-left:auto;min-width:1.3rem;padding:.05rem .4rem;border-radius:999px;background:rgba(255,255,255,.22);color:#fff;font-size:.72rem;font-weight:800;text-align:center}
.compte-nav.retard{background:#F59E0B;color:#111}
.liste-notifs{display:grid;gap:.3rem}
.liste-notifs a{display:grid;grid-template-columns:2rem 1fr;gap:.6rem;padding:.6rem;border-radius:10px;text-decoration:none;color:inherit;border:1px solid transparent}
.liste-notifs a:hover{background:var(--surface2);border-color:var(--trait)} .liste-notifs a>span:last-child{display:grid;gap:.1rem}
.liste-notifs a.non-lu{background:var(--marque-pale)} .liste-notifs a.non-lu b::before{content:"";display:inline-block;width:.45rem;height:.45rem;border-radius:50%;background:var(--marque);margin-right:.35rem;vertical-align:middle}
.ico-n{width:2rem;height:2rem;border-radius:50%;background:var(--gris-fond);display:grid;place-items:center;color:var(--marque)} .ico-n svg{width:1rem;height:1rem}
.rouge-t{color:var(--rouge)} .vert-t{color:var(--vert)}
.av{width:1.55rem;height:1.55rem;border-radius:50%;display:inline-grid;place-items:center;font-size:.6rem;font-weight:800;background:var(--accent);color:#fff;text-transform:uppercase;border:2px solid var(--surface);margin-left:-.35rem;flex:none}
.avs{display:inline-flex;margin-left:auto;padding-left:.35rem}
.mention{color:var(--marque);font-weight:700;background:var(--marque-pale);border-radius:4px;padding:0 .2rem}

.plans-barre{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;margin-bottom:.8rem}
.kanban{display:flex;gap:.9rem;overflow-x:auto;padding:0 .1rem 1rem;align-items:stretch;scroll-snap-type:x proximity;min-height:20rem}
.colonne-k{flex:0 0 18.5rem;background:#EEF1F5;border-radius:14px;padding:.6rem;display:grid;gap:.5rem;align-content:start;scroll-snap-align:start;max-height:calc(100vh - 14rem);grid-template-rows:auto auto 1fr}
.colonne-k.terminee{background:#E9F5EE}
.colonne-k header{display:flex;align-items:center;gap:.35rem;padding:.15rem .2rem}
.colonne-k h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.05em;color:var(--encre2);flex:1}
.colonne-k .nb{font-size:.75rem;font-weight:800;color:var(--encre3);background:rgba(255,255,255,.7);border-radius:999px;padding:.05rem .45rem}
.mini-b{border:0;background:none;color:var(--encre3);cursor:pointer;border-radius:6px;width:1.7rem;height:1.7rem;font-size:1rem;line-height:1}
.mini-b:hover{background:rgba(0,0,0,.06);color:var(--encre)}
.ajout-t input{width:100%;border:1px dashed var(--trait2);background:rgba(255,255,255,.6);border-radius:9px;padding:.5rem .65rem;font-size:.88rem}
.ajout-t input:focus{outline:none;border-style:solid;border-color:var(--marque);background:#fff}
.cartes-k{display:grid;gap:.5rem;overflow-y:auto;min-height:3rem;padding:2px;align-content:start}
.carte-t{background:var(--surface);border:1px solid var(--trait);border-radius:10px;padding:.6rem .7rem;box-shadow:0 1px 2px rgba(17,24,39,.06);cursor:pointer;display:grid;gap:.4rem;user-select:none;transition:box-shadow .15s,border-color .15s}
.carte-t:hover{border-color:var(--marque);box-shadow:0 4px 14px rgba(17,24,39,.1)}
.carte-t:focus-visible{outline:2px solid var(--accent)}
.carte-t.prio-urgente{border-left:4px solid var(--rouge)} .carte-t.prio-haute{border-left:4px solid #F59E0B}
.carte-t.finie .ct-titre b{text-decoration:line-through;color:var(--encre3)}
.etiq-l{display:flex;flex-wrap:wrap;gap:.25rem}
.etiq-l span,.etiq-mini{font-size:.66rem;font-weight:750;color:#fff;background:var(--c);border-radius:5px;padding:.08rem .4rem}
.etiq-mini{margin-right:.25rem}
.ct-titre{display:flex;gap:.35rem;align-items:flex-start;font-size:.9rem;line-height:1.3}
.ct-titre .poignee{height:1.3rem;width:1.1rem;font-size:.85rem;margin-left:-.3rem}
.prio{color:var(--rouge);font-weight:900}
.ct-lien{font-size:.76rem;color:var(--encre2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ct-lien.gros{font-size:.9rem;white-space:normal}
.ct-meta{display:flex;gap:.55rem;align-items:center;font-size:.74rem;color:var(--encre3);flex-wrap:wrap}
.ct-meta .ech.retard{color:#fff;background:var(--rouge);border-radius:5px;padding:.05rem .35rem;font-weight:700}
.ct-meta .ok{color:var(--vert);font-weight:700}
.ajout-col{flex:0 0 13rem;border:2px dashed var(--trait2);background:transparent;border-radius:14px;padding:1rem;color:var(--encre2);font-weight:650;cursor:pointer;display:flex;gap:.4rem;align-items:center;justify-content:center}
.ajout-col:hover{border-color:var(--marque);color:var(--marque)} .ajout-col svg{width:1rem;height:1rem}
.fantome-k{position:fixed;z-index:200;pointer-events:none;box-shadow:0 18px 40px rgba(17,24,39,.28);opacity:.95}
.carte-t.dd-avant{box-shadow:0 -3px 0 var(--marque)} .carte-t.dd-apres{box-shadow:0 3px 0 var(--marque)}
.colonne-k.dd-dans{outline:2px dashed var(--marque);outline-offset:2px}
.colonne-k.dd-avant{box-shadow:-4px 0 0 var(--marque)} .colonne-k.dd-apres{box-shadow:4px 0 0 var(--marque)}
.colonne-k.glisse,.carte-t.glisse{opacity:.35}
.fiche-tache{display:grid;gap:1rem}
.titre-tache{font:inherit;font-size:1.2rem;font-weight:750;border:1px solid transparent;border-radius:9px;padding:.4rem .5rem;width:100%}
.titre-tache:hover{border-color:var(--trait2)} .titre-tache:focus{outline:none;border-color:var(--marque);box-shadow:0 0 0 3px var(--marque-voile)}
.puce-etiq{display:inline-flex;align-items:center;gap:.35rem;border:1px solid var(--c);color:var(--c);border-radius:7px;padding:.25rem .55rem;font-size:.8rem;font-weight:700;cursor:pointer}
.puce-etiq:has(input:checked){background:var(--c);color:#fff}
.puce-etiq input{accent-color:#fff}
.liste-ck{display:grid;gap:.2rem;margin-top:.35rem}
.el-ck{display:flex;gap:.5rem;align-items:center;padding:.3rem .2rem;border-radius:7px}
.el-ck:hover{background:var(--surface2)} .el-ck span{flex:1} .el-ck.fait span{text-decoration:line-through;color:var(--encre3)}
.el-ck input{width:1.05rem;height:1.05rem;accent-color:var(--marque)}
.ajout-ck{margin-top:.3rem}
.fil-c{display:grid;gap:.7rem;margin:.4rem 0 .6rem}
.com{display:flex;gap:.55rem} .com .av{margin:0} .com p{margin:.15rem 0 0;font-size:.9rem}
.ajout-com{display:flex;gap:.5rem;align-items:flex-end} .ajout-com textarea{flex:1}
.ligne-etiq{display:flex;gap:.4rem;align-items:center} .ligne-etiq input[type=color]{width:2.4rem;height:2.2rem;border:1px solid var(--trait2);border-radius:7px;padding:.1rem;background:#fff}
.pj{display:inline-flex;gap:.35rem;align-items:center;border:1px solid var(--trait2);background:var(--surface);border-radius:8px;padding:.3rem .6rem;font-size:.82rem;cursor:pointer;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pj:hover{border-color:var(--marque)}

.type-tk{display:inline-block;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;padding:.12rem .45rem;border-radius:6px;background:var(--gris-fond);color:var(--encre2)}
.type-tk.t-technique{background:#E0E7FF;color:#3730A3} .type-tk.t-commerciale{background:#DCFCE7;color:#166534} .type-tk.t-administrative{background:#FEF3C7;color:#92400E}
.p-attente2{background:#EDE9FE;color:#5B21B6}
tr.non-lu td b{font-weight:850} tr.non-lu{background:color-mix(in srgb,var(--marque) 5%,transparent)}
@media (min-width:641px){tr.non-lu td:first-child{box-shadow:inset 3px 0 0 var(--marque)}}
.barre-tk{display:flex;gap:.7rem;align-items:center;flex-wrap:wrap;background:var(--surface);border:1px solid var(--trait);border-radius:var(--rayon);padding:.7rem .9rem;margin-bottom:1rem;font-size:.9rem}
.mini-champ{display:inline-flex;gap:.35rem;align-items:center;font-size:.82rem;font-weight:600;color:var(--encre2)}
.mini-champ select{border:1px solid var(--trait2);border-radius:7px;padding:.3rem .45rem;background:var(--surface);font-size:.85rem}
.fil-tk{display:grid;gap:.8rem}
.msg{max-width:min(40rem,92%);border-radius:14px;padding:.7rem .9rem;border:1px solid var(--trait)}
.msg p{margin:.3rem 0 .2rem;font-size:.92rem;line-height:1.5}
.msg.client{background:var(--surface2);justify-self:start;border-top-left-radius:4px}
.msg.equipe{background:var(--marque-pale);border-color:var(--marque-voile);justify-self:end;border-top-right-radius:4px}
.msg.interne{background:#FFFBEB;border:1px dashed #F59E0B}
.msg-tete{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.msg-sys{justify-self:center;font-size:.78rem;color:var(--encre3);background:var(--gris-fond);border-radius:999px;padding:.2rem .7rem;text-align:center}
.saisie-tk{display:grid;gap:.6rem;margin-top:1.2rem;border-top:1px solid var(--trait);padding-top:1rem}
.saisie-tk.interne textarea{background:#FFFBEB;border-color:#F59E0B}
.saisie-tk .espace{flex:1}
.regles-tk{display:grid;gap:.8rem}
.regle-tk{display:grid;grid-template-columns:9rem 1fr 1fr;gap:1rem;align-items:start;border:1px solid var(--trait);border-radius:10px;padding:.8rem}
.regle-tk>div{display:grid;gap:.35rem}
@media (max-width:900px){.regle-tk{grid-template-columns:1fr}}
.puces-adr{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center}
.puces-adr .saisie{width:auto;flex:1 1 12rem;padding:.35rem .55rem;font-size:.85rem}
.adr{display:inline-flex;gap:.3rem;align-items:center;background:var(--marque-pale);color:var(--marque);border-radius:7px;padding:.2rem .3rem .2rem .55rem;font-size:.82rem;font-weight:650}
.adr button{border:0;background:none;color:inherit;cursor:pointer;font-size:.8rem}
.ligne-bx{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap} .ligne-bx .saisie{width:auto;flex:1 1 14rem} .ligne-bx select.saisie{flex:0 0 10rem}
.suivi-ed{display:grid;gap:.5rem}
.etape-s{display:grid;gap:.3rem;border-left:3px solid var(--trait2);padding-left:.6rem}
.etape-s.fait{border-left-color:var(--vert)}
.etape-s .saisie{padding:.35rem .55rem;font-size:.84rem}
@media (max-width:640px){.colonne-k{flex-basis:84vw;max-height:none}.kanban{margin:0 -16px;padding:0 16px 1rem}}

/* ───── Espace client ───── */
body.espace{background:var(--fond)}
.logo-e{display:flex;align-items:center} .logo-e img{max-height:2.6rem;max-width:12rem;object-fit:contain} .logo-e b{color:var(--marque);font-size:1.1rem}
.porte .logo-e{justify-content:center;margin-bottom:1rem}
.haut-e{display:flex;align-items:center;gap:1rem;padding:.8rem max(16px,calc((100vw - 64rem)/2));background:var(--surface);border-bottom:1px solid var(--trait);position:sticky;top:0;z-index:30}
.haut-e .qui{margin-left:auto;display:grid;text-align:right;font-size:.85rem;line-height:1.25} .haut-e .qui span{color:var(--encre3)}
.nav-e{display:flex;gap:.2rem;overflow-x:auto;padding:0 max(16px,calc((100vw - 64rem)/2));background:var(--surface);border-bottom:1px solid var(--trait);scrollbar-width:none}
.nav-e button{border:0;background:none;padding:.8rem .85rem;font-weight:650;font-size:.9rem;color:var(--encre3);cursor:pointer;border-bottom:3px solid transparent;white-space:nowrap}
.nav-e button[aria-current=page]{color:var(--marque);border-bottom-color:var(--marque)}
.nav-e .n{display:inline-grid;place-items:center;min-width:1.2rem;height:1.2rem;border-radius:999px;background:var(--marque);color:#fff;font-size:.7rem;margin-left:.35rem;padding:0 .3rem}
.espace-c{max-width:64rem} .espace-c h1{font-size:1.4rem}
.espace-c .kpi{text-decoration:none}
.pied-e{text-align:center;padding:1.5rem 16px 2.5rem}
.etapes-cmd{display:grid;gap:0}
.etape-c{display:grid;grid-template-columns:2rem 1fr;gap:.7rem;position:relative;padding-bottom:1.1rem}
.etape-c:not(:last-child)::before{content:"";position:absolute;left:.95rem;top:2rem;bottom:0;width:2px;background:var(--trait2)}
.etape-c.fait:not(:last-child)::before{background:var(--vert)}
.etape-c i{font-style:normal;width:2rem;height:2rem;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:.85rem;background:var(--gris-fond);color:var(--encre3);border:2px solid var(--trait2)}
.etape-c.fait i{background:var(--vert);border-color:var(--vert);color:#fff} .etape-c.cours i{background:#fff;border-color:var(--marque);color:var(--marque);box-shadow:0 0 0 4px var(--marque-voile)}
.etape-c div{display:grid;padding-top:.25rem} .etape-c small{color:var(--encre3)}
.ligne-inv{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem} .ligne-inv .saisie{flex:1 1 12rem;width:auto}
.liste-l .el{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.6rem 0;border-bottom:1px solid var(--trait)}
@media (max-width:640px){.haut-e .qui{display:none}}
@media (max-width:640px){.pub-t .cacher-m{display:none}.pub-t td,.pub-t th{padding:.5rem .4rem}}
.espace-c>.lien,.pub>.lien{justify-self:start;font-size:.95rem}
