/* Style commun des pages secondaires (suivi de commande, fiches entreprise, pages légales, admin). */
:root{
  color-scheme:light;
  --bg:#ffffff; --surface:#ffffff; --bg-soft:#f3f5fb; --soft:#eef0ff;
  --ink:#0b1533; --ink-2:#2a3352; --muted:#5b6480; --line:#e2e6f0;
  --accent:#2f3fe6; --accent-dark:#2230c4; --accent-ink:#ffffff;
  --mark:#ffd93d; --ok:#0e9f6e; --ok-soft:#e3f6ee; --warn:#b26a00; --warn-soft:#fff3d6; --seal:#d23b3b; --seal-soft:#fdeaea;
  --font-display:"Bricolage Grotesque","Avenir Next",system-ui,sans-serif;
  --font-body:"Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:var(--font-body);
  --shadow:0 1px 2px rgba(11,21,51,.06),0 8px 24px rgba(11,21,51,.08);
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg-soft);color:var(--ink);font:17px/1.6 var(--font-body);-webkit-font-smoothing:antialiased}
.wrap{max-width:900px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px));padding-block:0 4rem}
a{color:var(--accent)}
h1,h2,h3{font-family:var(--font-display);text-wrap:balance;letter-spacing:-.02em;line-height:1.1}
h1{font-size:clamp(2rem,4.5vw,2.9rem);font-weight:800;margin:.5rem 0 1rem}
h2{font-size:1.35rem;font-weight:700;margin:2.2rem 0 .7rem}
.eyebrow{display:inline-flex;align-items:center;font:600 .82rem/1 var(--font-body);color:var(--accent);background:var(--soft);padding:.45rem .75rem;border-radius:999px;margin:0}
.muted{color:var(--muted)}
.mono{font-variant-numeric:tabular-nums;letter-spacing:.01em}

/* En-tête commun : bandeau blanc avec le logo */
html,body{overflow-x:clip}
.top{position:relative;isolation:isolate;display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin:0 0 2rem;padding-block:.95rem}
.top::before{content:"";position:absolute;z-index:-1;inset:0 calc(50% - 50vw);background:#fff;border-bottom:1px solid var(--line)}
.top a.muted{text-decoration:none;font-weight:500;color:var(--ink-2)}
.top a.muted:hover{color:var(--accent)}
.logo{display:inline-flex;align-items:center;gap:.6rem;font:800 1.25rem/1 var(--font-display);color:var(--ink);text-decoration:none;letter-spacing:-.02em}
.logo::before{content:"";width:32px;height:32px;flex:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='9' fill='%232F3FE6'/%3E%3Cpath d='M10 7h8l5 5v13a1 1 0 0 1-1 1H10a1 1 0 0 1-1-1V8a1 1 0 0 1 1-1z' fill='%23fff'/%3E%3Cpath d='M18 7v4a1 1 0 0 0 1 1h4' fill='%23D9DDFF'/%3E%3Crect x='11.5' y='15.5' width='9' height='3.2' rx='1.6' fill='%23FFD93D'/%3E%3Cpath d='M12.2 21.8h6.4' stroke='%232F3FE6' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}

button,.btn{font:600 1rem/1 var(--font-body);border:0;border-radius:12px;padding:.9rem 1.2rem;cursor:pointer;background:var(--accent);color:var(--accent-ink);text-decoration:none;display:inline-flex;gap:.5rem;align-items:center;justify-content:center;box-shadow:0 6px 16px rgba(47,63,230,.25)}
button:hover,.btn:hover{background:var(--accent-dark)}
.btn-ghost{background:#fff;color:var(--ink);border:1.5px solid var(--line);box-shadow:none}
.btn-ghost:hover{background:var(--bg-soft)}
button:focus-visible,.btn:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--mark);outline-offset:2px}
input,select{font:inherit;color:var(--ink);background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:.7rem .85rem}
input:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 4px rgba(47,63,230,.12)}
.card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:1.6rem;box-shadow:var(--shadow)}
.pill{display:inline-flex;align-items:center;gap:.35rem;font:600 .82rem/1 var(--font-body);padding:.45rem .75rem;border-radius:999px;white-space:nowrap}
.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.s-en_attente_paiement{color:var(--muted);background:var(--bg-soft)}
.s-payee,.s-en_cours{color:var(--warn);background:var(--warn-soft)}
.s-livree{color:var(--ok);background:var(--ok-soft)}
.s-remboursee{color:var(--seal);background:var(--seal-soft)}
.placeholder{background:var(--mark);padding:0 .25rem;border-radius:3px}
p,li{max-width:70ch}
