Voice assistant: immediate working/waiting spinner on Send

portal/templates/voice.html

@@ -7,15 +7,31 @@
   <div class="admin-panel">
     <div class="linkout-card stack">
       {% if error %}<div class="form-error">{{ error }}</div>{% endif %}
-      <form method="post" action="/voice">
+      <form method="post" action="/voice" onsubmit="onSend()">
         <div class="form-field">
           <label for="message">Command</label>
           <input class="text-input" id="message" name="message"
                  placeholder="e.g. what time is it, what's the weather, turn on the lights, play some music, Donald tell me a joke…"
                  value="{{ command or '' }}" required>
         </div>
-        <button class="button button-primary width-full" type="submit">Send</button>
+        <button class="button button-primary width-full" type="submit" id="sendBtn">Send</button>
       </form>
+      <div id="waiting" class="waiting">
+        <span class="spinner"></span> Working — asking Jervis…
+      </div>
+      <style>
+        .waiting { display: none; align-items: center; gap: 8px; margin-top: 14px; color: #555; font: var(--type-body-sm); }
+        .spinner { width: 16px; height: 16px; border: 2px solid #d7d7d7; border-top-color: var(--primary, #0075de); border-radius: 50%; animation: spin .7s linear infinite; flex: none; }
+        @keyframes spin { to { transform: rotate(360deg); } }
+      </style>
+      <script>
+        function onSend() {
+          var b = document.getElementById('sendBtn');
+          if (b) { b.disabled = true; b.textContent = 'Sending…'; }
+          var w = document.getElementById('waiting');
+          if (w) { w.style.display = 'flex'; }
+        }
+      </script>
       {% if reply %}
       <div class="linkout-card stack" style="margin-top:16px">
         <strong>Jervis:</strong>