extra data in stats

app/static/styles.css

@@ -418,4 +418,36 @@ form.inline-form {
 .alert-error {
   background-color: #f8d7da;
   color: #721c24;
-}
+}
+
+.auto-refresh-toggle {
+  margin-top: 1rem;
+  margin-bottom: 1.5rem;
+  padding: 0.5rem 1rem;
+  background-color: var(--card-bg);
+  border: 1px solid #666;
+  border-radius: 8px;
+  font-size: 0.95rem;
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+  color: var(--fg);
+}
+
+.auto-refresh-toggle label {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  font-weight: bold;
+  cursor: pointer;
+}
+
+.auto-refresh-toggle input[type="checkbox"] {
+  transform: scale(1.2);
+  accent-color: var(--accent);
+}
+
+.auto-refresh-toggle #refresh-status {
+  font-style: italic;
+  opacity: 0.8;
+}

app/templates/stats.html

@@ -21,6 +21,14 @@
     <button type="submit">Update</button>
 </form>
 
+<div class="auto-refresh-toggle">
+    <label>
+      <input type="checkbox" id="auto-refresh-checkbox">
+      Auto-refresh every 30s
+    </label>
+    <span id="refresh-status"></span>
+  </div>
+
 <div class="stats-container">
 
     <!-- Access-Accept Card -->
@@ -32,6 +40,7 @@
                     <th>MAC Address</th>
                     <th>Description</th>
                     <th>Vendor</th>
+                    <th>VLAN</th>
                     <th>Time</th>
                 </tr>
             </thead>
@@ -41,6 +50,7 @@
                     <td>{{ entry.mac_address }}</td>
                     <td>{{ entry.description or '' }}</td>
                     <td class="vendor-cell" data-mac="{{ entry.mac_address }}">{{ entry.vendor or '...' }}</td>
+                    <td>{{ entry.vlan_id or '?' }}</td>
                     <td>{{ entry.ago }}</td>
                 </tr>
                 {% endfor %}
@@ -158,14 +168,6 @@
 </div>
 </div>
 
-<div class="auto-refresh-toggle">
-    <label>
-        <input type="checkbox" id="auto-refresh-checkbox">
-        Auto-refresh every 30s
-    </label>
-    <span id="refresh-status" style="margin-left: 1em; font-size: 0.9em; color: gray;"></span>
-</div>
-
 <script>
     document.addEventListener('DOMContentLoaded', () => {
         // MAC vendor lookup