/* ===== widget Suivi : la demande du client arrive en notification, puis sa carte avance dans le tableau
   de l'espace client (Reçu → En cours → Fait) et le client est prévenu. Carte .wz, unités cqw. ===== */
.svw{position:absolute;inset:0;container-type:inline-size;font-family:Inter,"Figtree",system-ui,sans-serif;-webkit-font-smoothing:antialiased;color:#221726}
.svw *{box-sizing:border-box}.svw p{margin:0;font:inherit;color:inherit;letter-spacing:normal}
.svw-tab{position:absolute;left:5cqw;top:24cqw;width:90cqw;height:72cqw;border-radius:2cqw;overflow:hidden;background:#FBF8F5;border:.25cqw solid #221726;box-shadow:0 3cqw 6cqw -2cqw rgba(34,23,38,.45)}
.svw-barre{height:7cqw;display:flex;align-items:center;gap:1.4cqw;padding:0 2.6cqw;background:#fff;border-bottom:.15cqw solid #EDE6DF;font:600 2.3cqw/1 Inter,system-ui}
.svw-barre em{margin-left:auto;font:500 1.8cqw/1 Inter,system-ui;font-style:normal;color:#8C8497}
.svw-cols{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:2cqw;padding:2.4cqw}
.svw-col h6{margin:0 0 1.6cqw;display:flex;align-items:center;gap:1cqw;font:700 1.9cqw/1 Inter,system-ui;color:#6B5E72;text-transform:uppercase;letter-spacing:.04em}
.svw-col h6 i{width:1.5cqw;height:1.5cqw;border-radius:50%;background:var(--c)}
.svw-col h6 b{margin-left:auto;font-weight:600;color:#9A93A3}
.svw .svw-c{height:13cqw;margin-bottom:1.6cqw;padding:1.6cqw;border-radius:1.4cqw;background:#fff;border:.15cqw solid #EDE6DF;font:500 1.85cqw/1.3 Inter,system-ui;color:#4A3E50}
.svw .svw-c small{display:block;margin-top:.9cqw;font-size:1.55cqw;color:#9A93A3}
/* la carte qui voyage (positionnée en JS au-dessus des colonnes) */
.svw .svw-t{position:absolute;left:0;top:0;height:17cqw;padding:1.6cqw;border-radius:1.4cqw;background:#fff;border:.25cqw solid #221726;box-shadow:0 1.6cqw 3cqw -1cqw rgba(34,23,38,.35);
  font:600 1.95cqw/1.3 Inter,system-ui;transition:transform .8s cubic-bezier(.65,0,.35,1),box-shadow .3s,border-color .3s;z-index:2}
.svw-t small{display:flex;align-items:center;gap:.8cqw;margin-top:1cqw;font:500 1.55cqw/1 Inter,system-ui;color:#8C8497}
.svw-t small i{width:2.6cqw;height:2.6cqw;border-radius:50%;background:#9BE3A8;display:grid;place-items:center;font:700 1.1cqw/1 system-ui;font-style:normal;color:#141414;opacity:0;transition:opacity .3s}
.svw-t.pris small i{opacity:1}
.svw-t .etat{display:inline-block;margin-top:1cqw;padding:.5cqw 1.1cqw;border-radius:99px;background:#FFF1C4;color:#8A6400;font:700 1.45cqw/1 Inter,system-ui}
.svw-t.fait{border-color:#2E9E6A}.svw-t.fait .etat{background:#E4F6EC;color:#2E9E6A}
.svw-t.leve{box-shadow:0 3cqw 5cqw -1.4cqw rgba(34,23,38,.5)}
/* notifications */
.svw-notif{position:absolute;left:10cqw;right:10cqw;display:flex;gap:1.8cqw;align-items:center;padding:2cqw 2.4cqw;border-radius:2.4cqw;background:rgba(255,255,255,.96);
  border:.25cqw solid #221726;box-shadow:0 2cqw 4cqw -1.6cqw rgba(34,23,38,.5);font:500 2cqw/1.3 Inter,system-ui;opacity:0;transform:translateY(-3cqw) scale(.96);
  transition:opacity .35s,transform .45s cubic-bezier(.34,1.56,.64,1);z-index:3}
.svw-notif.on{opacity:1;transform:none}
.svw-notif .av{flex:none;width:5.4cqw;height:5.4cqw;border-radius:1.4cqw;display:grid;place-items:center;font:700 2cqw/1 Inter,system-ui;color:#fff;background:var(--c)}
.svw-notif b{display:block;font-weight:700;font-size:1.9cqw}.svw-notif small{display:block;color:#8C8497;font-size:1.6cqw;margin-bottom:.3cqw}
.svw-n1{top:6cqw}.svw-n2{top:6cqw}
.svw-ecrit{display:inline-flex;gap:.5cqw;margin-left:.8cqw;vertical-align:middle}.svw-ecrit u{display:block;width:.9cqw;height:.9cqw;border-radius:50%;background:#9A93A3;text-decoration:none;animation:svwPt 1s infinite}
.svw-ecrit u:nth-child(2){animation-delay:.15s}.svw-ecrit u:nth-child(3){animation-delay:.3s}
@keyframes svwPt{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-.6cqw);opacity:1}}
/* lisibilité : la vignette fait ~340 px de large, donc 1cqw ≈ 3,4 px ; rien sous ~9 px à l'écran */
.svw-tab{left:4cqw;width:92cqw;top:27cqw;height:78cqw}
.svw-barre{height:10cqw;padding:0 3.2cqw;font-size:3.6cqw}.svw-barre em{font-size:2.8cqw}
.svw-cols{gap:2cqw;padding:3cqw 2.6cqw}
.svw-col h6{font-size:2.8cqw;margin-bottom:2.2cqw;gap:1.2cqw;letter-spacing:.02em}.svw-col h6 i{width:2.2cqw;height:2.2cqw}
.svw-col h6 b{min-width:4cqw;height:4cqw;border-radius:99px;display:grid;place-items:center;background:#EFE8E1;color:#6B5E72;font-size:2.5cqw;transition:background .3s,color .3s}
.svw-col h6 b.maj{background:#221726;color:#fff}
.svw .svw-c{height:22cqw;margin-bottom:2cqw;padding:2.2cqw;font-size:3.3cqw;line-height:1.25}.svw .svw-c small{margin-top:1.2cqw;font-size:2.6cqw}
.svw .svw-t{height:27cqw;padding:2.2cqw;font-size:3.4cqw;line-height:1.2;display:flex;flex-direction:column;align-items:flex-start}
.svw-t .etat{margin-top:auto;font-size:2.5cqw;padding:.8cqw 1.6cqw}
.svw-t small{margin-top:1.4cqw;font-size:2.6cqw;gap:1cqw}
.svw-t small i{width:4cqw;height:4cqw;font-size:2.2cqw;background:#4F46E5;color:#fff}
.svw-notif{left:5cqw;right:5cqw;gap:2.4cqw;padding:2.6cqw 3cqw;font-size:3.2cqw}
.svw-notif b{font-size:3.2cqw;line-height:1.25}.svw-notif small{font-size:2.6cqw;margin-bottom:.6cqw}
.svw-notif .av{width:8cqw;height:8cqw;border-radius:2cqw;font-size:3cqw}
.svw-n1,.svw-n2{top:4cqw}
.svw-ecrit{gap:.7cqw;margin-left:1cqw}.svw-ecrit u{width:1.2cqw;height:1.2cqw}
/* tant que personne ne l'a prise, la carte n'affiche que son état (le client vient de parler dans la notification) */
.svw-t:not(.pris) small{display:none}
.svw-tab{height:74cqw}