/* Slide to send */
.sldr{--p:0;--max:0px;position:relative;height:56px;border-radius:28px;background:#f2f5f6;border:1.5px solid #dbe3e5;overflow:hidden;user-select:none;touch-action:pan-y;margin-top:4px}
.sldr:before{content:"";position:absolute;inset:0;border-radius:28px;background:linear-gradient(90deg,#c79b32,#e0b84d);width:calc(var(--p)*100%)}
.sldr-hint,.sldr-done{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:10px;font-weight:700;font-size:15px;pointer-events:none}
.sldr-hint{color:#073b45;opacity:calc(1 - var(--p)*1.6)}
.sldr-done{color:#fff;opacity:calc(var(--p)*1.4 - .4)}
.sldr-chev{display:flex;gap:3px}
.sldr-chev i{width:7px;height:7px;border-top:2px solid #c79b32;border-right:2px solid #c79b32;transform:rotate(45deg);animation:sldrChev 1.4s ease-in-out infinite}
.sldr-chev i:nth-child(2){animation-delay:.15s}.sldr-chev i:nth-child(3){animation-delay:.3s}
@keyframes sldrChev{0%,100%{opacity:.25}50%{opacity:1}}
.sldr-knob{position:absolute;top:3px;left:3px;width:50px;height:50px;border-radius:50%;background:#073b45;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 16px rgba(7,59,69,.3);cursor:grab;transform:translateX(calc(var(--p)*var(--max)))}
.sldr-knob:active{cursor:grabbing}
.sldr-knob svg{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:block}
.sldr.is-sending .sldr-knob svg{display:none}
.sldr.is-sending .sldr-knob:after{content:"";width:20px;height:20px;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:sldrSpin .8s linear infinite}
.sldr.is-sent{background:#e9f6ef;border-color:#bfe3cf}
.sldr.is-sent:before{background:#1e7b4f;width:100%}
.sldr.is-sent .sldr-knob{background:#1e7b4f;transform:translateX(var(--max))}
.sldr:focus-visible{outline:3px solid #c79b32;outline-offset:3px}
.sldr-alt{display:block;background:none;border:0;margin:10px auto 0;padding:0;color:#8a979a;font:inherit;font-size:12.5px;text-decoration:underline;cursor:pointer}
@keyframes sldrSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.sldr-chev i{animation:none;opacity:.7}}