/* Circuit de commande : cloche, options du panier, signature, encours */
.fbell{position:relative;border:1px solid var(--line);background:var(--surface);border-radius:99px;width:40px;height:40px;display:inline-grid;place-items:center;cursor:pointer;font-size:18px;flex:none}
.fbell.on{border-color:var(--bad);animation:fring 1.2s ease-in-out 2}
.fbadge{position:absolute;top:-5px;right:-6px;min-width:20px;height:20px;padding:0 5px;border-radius:99px;background:var(--bad);color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;font-family:var(--mono)}
@keyframes fring{0%,100%{transform:rotate(0)}20%{transform:rotate(-14deg)}40%{transform:rotate(12deg)}60%{transform:rotate(-8deg)}80%{transform:rotate(5deg)}}
.fnotif{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:start;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.fnotif.unread{border-color:color-mix(in srgb,var(--accent) 50%,var(--line));background:color-mix(in srgb,var(--accent) 6%,var(--surface))}
.fnotif .fico{font-size:20px}.fnb{display:flex;flex-direction:column;gap:2px;min-width:0}.fna{display:flex;flex-direction:column;gap:4px}
.fco{display:flex;flex-direction:column;gap:12px}
.fopts{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px}
.fopt{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:10px;padding:10px 12px;cursor:pointer;background:var(--surface)}
.fopt input{margin-top:3px}.fopt span{display:flex;flex-direction:column;gap:2px}
.fopt.on{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 25%,transparent)}
.fopt.dis{opacity:.55;cursor:not-allowed}
.fsign{display:flex;flex-direction:column;gap:14px;max-width:640px}
.fdoc{border:1px solid var(--line);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:8px;background:var(--surface)}
.fdlines{max-height:260px;overflow-y:auto}
.fcode{font-family:var(--mono);font-size:22px;letter-spacing:.3em;text-align:center;max-width:220px}
.fpadw{display:flex;flex-direction:column;gap:6px;align-items:flex-end}
.fpad{width:100%;height:180px;border:2px dashed var(--line);border-radius:12px;background:#fff;touch-action:none;cursor:crosshair}
.fbig{min-height:52px;font-size:17px}
.fdone{display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:12px;background:color-mix(in srgb,var(--good) 12%,var(--surface));border:1px solid color-mix(in srgb,var(--good) 45%,var(--line))}
.fdone b{color:var(--good);font-size:17px}
.fobox{gap:8px}
.pill.a_signer{color:var(--warn);border-color:color-mix(in srgb,var(--warn) 45%,var(--line))}
.fcl{display:flex;flex-direction:column;gap:8px}
.fclr{display:grid;grid-template-columns:minmax(0,1fr) 160px;gap:12px;align-items:center;text-decoration:none;color:inherit;padding:6px 0;border-bottom:1px solid var(--line)}
.fclr>span{display:flex;flex-direction:column}
@media (max-width:600px){.fclr{grid-template-columns:1fr}}