:root{
  --ground:#f3f6fb; --surface:#fff; --surface-2:#eef2f9; --surface-3:#e5ecf6;
  --ink:#0f1a27; --ink-soft:#48586c; --ink-faint:#7a889b;
  --line:#dce4ee; --line-soft:#e9eef6;
  --primary:#0e3a67; --primary-2:#12518f; --accent:#149bc2;
  --recue:#2563eb; --prep:#b4601b; --prete:#158a5e; --livree:#64748b; --annulee:#b02a2a;
  --recue-bg:#e7efff; --prep-bg:#fbeee0; --prete-bg:#e2f3ec; --livree-bg:#eef1f5; --annulee-bg:#fbe7e7;
  --radius:12px; --shadow:0 1px 2px rgba(15,26,39,.05),0 10px 26px -14px rgba(14,58,103,.22);
}
*{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--ink);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:16px;line-height:1.5}
h1,h2,h3{margin:0;line-height:1.15}
button{font-family:inherit}
.wrap{max-width:1080px;margin-inline:auto;padding-inline:20px}
.mono{font-variant-numeric:tabular-nums}

/* top bar */
.topbar{background:var(--primary);color:#fff;position:sticky;top:0;z-index:10}
.topbar .wrap{display:flex;align-items:center;gap:14px;height:64px}
.topbar .brand{display:flex;align-items:center;gap:10px;font-weight:700}
.topbar .brand svg{width:26px;height:26px}
.topbar .sp{margin-left:auto}
.topbar a,.topbar button.link{color:#cfe3f2;background:none;border:none;cursor:pointer;font-size:.92rem;text-decoration:none}
.topbar a:hover{color:#fff}

.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.section-title{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);font-weight:700;margin-bottom:10px}

label{font-weight:600;font-size:.9rem;color:var(--ink-soft);display:block;margin-bottom:6px}
input,select,textarea{width:100%;font:inherit;padding:.6em .7em;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}
textarea{resize:vertical;min-height:64px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-weight:600;font-size:.95rem;
  padding:.7em 1.2em;border-radius:999px;border:1px solid transparent;cursor:pointer;transition:.15s}
.btn-primary{background:var(--primary);color:#fff}
.btn-primary:hover{background:var(--primary-2)}
.btn-primary:disabled{opacity:.45;cursor:not-allowed}
.btn-ghost{background:var(--surface);color:var(--ink);border-color:var(--line)}
.btn-ghost:hover{background:var(--surface-2)}
.btn-sm{padding:.4em .8em;font-size:.85rem}
.btn:focus-visible{outline:3px solid var(--accent);outline-offset:2px}

.pill{display:inline-flex;align-items:center;gap:.4em;font-size:.76rem;font-weight:700;padding:.25em .65em;border-radius:999px}
.st-recue{background:var(--recue-bg);color:var(--recue)}
.st-en_preparation{background:var(--prep-bg);color:var(--prep)}
.st-prete{background:var(--prete-bg);color:var(--prete)}
.st-livree{background:var(--livree-bg);color:var(--livree)}
.st-annulee{background:var(--annulee-bg);color:var(--annulee)}

.muted{color:var(--ink-faint)}
.hidden{display:none!important}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--ink);color:#fff;
  padding:.8em 1.2em;border-radius:10px;box-shadow:var(--shadow);z-index:50;font-size:.92rem;max-width:90vw}

/* filtre par categorie (catalogue de commande) */
.catfilters{max-width:360px;margin:14px 0}

/* article hors liste */
.offlist{margin:14px 0 18px;padding-top:14px;border-top:1px solid var(--line-soft)}
.offlist-form{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;margin-top:12px}
.offlist-form .field{flex:1;min-width:180px;margin-bottom:0}

/* qty stepper */
.stepper{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:var(--surface)}
.stepper button{width:38px;height:38px;border:none;background:var(--surface-2);color:var(--primary);font-size:1.2rem;cursor:pointer}
.stepper button:hover{background:var(--surface-3)}
.stepper input{width:52px;text-align:center;border:none;border-radius:0;padding:.4em 0;font-weight:700}
.stepper input:focus{outline:none}

@media(max-width:640px){.wrap{padding-inline:14px}}

/* ---- marque FCSI Solutions IT (éditeur du logiciel) ---- */
.fcsi-badge{display:inline-block;background:#0b1626;border-radius:16px;padding:10px 16px;box-shadow:0 10px 26px -14px rgba(11,22,38,.75)}
.fcsi-badge img{display:block;height:96px;width:auto}
.login-brand{display:flex;flex-direction:column;align-items:center;gap:9px;margin:0 0 20px}
.login-brand small{color:var(--ink-faint);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700}
.foot{display:flex;align-items:center;justify-content:center;gap:12px;margin:34px auto 26px;color:var(--ink-faint);font-size:.82rem;flex-wrap:wrap;text-align:center}
.foot img{height:34px;width:auto;border-radius:9px;box-shadow:0 6px 16px -10px rgba(11,22,38,.7)}
.foot a{color:var(--ink-soft);text-decoration:none;font-weight:700}
.foot a:hover{color:var(--primary)}
.pbrand{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #999;padding-bottom:6px;margin-bottom:10px;font-size:11px;color:#444}
.pbrand img{height:34px;width:auto}
@media print{.foot,.topbar{display:none!important}}
/* logo blanc : badge marine (connexion), barre du haut, pastille du pied de page */
.fcsi-badge{background:linear-gradient(160deg,#12518f,#0e3a67 60%,#0b2a4d);padding:14px 22px}
.fcsi-badge img{height:104px}
.tb-logo{height:46px;width:auto;margin-right:18px;opacity:1}
.fcsi-pill{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(160deg,#12518f,#0e3a67);border-radius:10px;padding:5px 9px;box-shadow:0 6px 16px -10px rgba(11,22,38,.7)}
.fcsi-pill img{height:30px;width:auto;border-radius:0;box-shadow:none}
.pbrand img{height:44px}
@media(max-width:560px){.tb-logo{display:none}}
.row-edit.inactive{opacity:.55}
.row-edit.inactive input[data-sf="name"]{text-decoration:line-through}